Form validation in select with angular

Asked

Viewed 699 times

3

How the select is validated using the ng-required="true"? For input I’m putting like this:

<form name="tarefasForm">
    <input type="text" ng-model="tarefa.solicitante" ng-required="true" name="solicitante-tarefa">
</form

<button ng-click="adicionaTarefa()" type="button"
     ng-disabled="tarefasForm.$invalid">Salvar
</button>

How’s it time for a select?

<div class="form-group">
   <label class="" for="orderBy">Tipo</label>
 <select ng-options="tipoTarefa as tipoTarefa.tipo for tipoTarefa in listaTipoTarefa track by tipoTarefa.codigo" ng-model="tarefa.codTipo" class="form-control cb"></select>
</div>
  • If I’m not mistaken, you just need to add one option when select with empty value - value="". <option value="">Selecione uma opção</option>

  • What you need to know, specifically?

1 answer

4


Looks exactly the same.

Take an example:

angular.module('app', []);
angular.module('app').controller('mainController', function($scope) {
  $scope.listaTipoTarefa = [
    { codigo: 1, tipo: 'Tipo 1' },
    { codigo: 2, tipo: 'Tipo 2' },
    { codigo: 3, tipo: 'Tipo 3' }
  ];
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<div ng-app="app" ng-controller="mainController">
  <form name="tarefasForm">
    <input type="text" ng-model="tarefa.solicitante" ng-required="true" name="solicitante-tarefa">
    <div class="form-group">
      <label class="" for="orderBy">Tipo</label>
      <select ng-required="true"
        ng-options="tipoTarefa as tipoTarefa.tipo for tipoTarefa in listaTipoTarefa track by tipoTarefa.codigo" 
        ng-model="tarefa.codTipo" class="form-control cb"></select>
    </div>
  </form>

  <button ng-click="adicionaTarefa()" type="button"
          ng-disabled="tarefasForm.$invalid">Salvar
  </button>
</div>

Browser other questions tagged

You are not signed in. Login or sign up in order to post.