Skip to main content
Essa OBS no inicio estava prejudicando a leitura e faz mais sentido perto do botão "Executar trecho de código". Incorporação de comentário do autor que me parece importante no texto principal.
Fonte Link
brasofilo
  • 6,7mil
  • 5
  • 30
  • 50

Você pode usar uma diretiva do angular para validar conforme abaixo:

OBS: Para visualizar o exemplo, abra em modo Página toda. Por algum motivo está cortando o botão próximo.
(conferir comentários explicativos no JavaScript)


OBS: Para visualizar o exemplo, abra em modo Página toda. Por algum motivo está cortando o botão próximo.

Você pode usar uma diretiva do angular para validar conforme abaixo:

OBS: Para visualizar o exemplo, abra em modo Página toda. Por algum motivo está cortando o botão próximo.

Você pode usar uma diretiva do angular para validar conforme abaixo:
(conferir comentários explicativos no JavaScript)


OBS: Para visualizar o exemplo, abra em modo Página toda. Por algum motivo está cortando o botão próximo.
Fim da Recompensa com 100 pontos de reputação concedidos por Renan Rodrigues
Incluido explanação código exemplo
Fonte Link
Emir Marques
  • 3,6mil
  • 14
  • 24

OBS: Para visualizar o exemplo todo abre, abra em modo Página toda. porPor algum motivo está cortando o botão próximo.

angular.module('myApp', ['ionic'])
  .directive('onValidSubmit', ['$parse', '$timeout',
    function($parse, $timeout) {
      return {
        require: '^form',
        restrict: 'A',
      /* Define link:requisito function(scopediretiva, element,ou attrsseja, form) {
     irá rodar dentro da tag form.$submitted = false;*/
          var fn =require: $parse(attrs.onValidSubmit);'^form',
         restrict: element.on('submit''A', function(event) {
          /* Compila scope.$apply(function()diretiva {*/
          link: function(scope, element, attrs, element.addClass('ng-submitted'form);
  {
            form.$submitted = true;false;
            var fn if= $parse(formattrs.$validonValidSubmit) {;
            /* Atribui evento onsubmit ifno (typeofform fnrelacionado ===a 'function')diretiva {*/
                  fnelement.on(scope'submit', {
                    $event: function(event
                  });
                }{
              }
            }scope.$apply(function();
          });{
        }
      }

    }
  ])
  element.directive('validated', ['$parse',
    functionaddClass($parse'ng-submitted') {;
      return {
        restrict: 'AEC',
       form.$submitted require:= '^form',true;
        link: function(scope, element, attrs, form) {
         /* varVerificar inputso =estado element.find("*");
dos campos que estão presente no form, ou seja, se forestão (varvalidos ide =acordo 0;com ia <validação inputsdenifida.length; i++) {
   Essa obdece o padrão do HTML5 com a tag (function(input)required {*/
              var attributes = input.attributes;
              if (attributes.getNamedItem('ng-model') != void 0 && attributesform.getNamedItem('name') != void 0$valid) {
                var field = form[attributes.name.value];
                if (fieldtypeof !=fn void=== 0'function') {
                  scope.$watch(function() {
                    return form.$submitted + "_" + field.$valid;
                  }, functionfn()scope, {
                    if (form.$submitted != true) return;
              /* Chama funcão callback caso a varvalidação inpesteja =OK angular.element(input);*/
                    if (inp.hasClass('ng-invalid')) {
            $event: event
         element.removeClass('has-success');
                      element.addClass('has-error'});
                    } else {
                      element.removeClass('has-error').addClass('has-success');}
                    }
                  });
                });
              }
            })(inputs[i]);
          }
   ]).controller('AppController', function($scope){
    }
/* Funcao callback executada caso a }
validação retorne um OK }*/
  ]).controller('AppController', function($scope){
  $scope.aposValidarDadosOK = function(){
        console.log("Proximo.......");
    };
});
  #btn_Codigo,
  #btn_Nome,
  #btn_Sexo {
    display: none;
  }
  input.ng-dirty.ng-invalid {
    border: 1px solid red;
  }
  form i.icon.error {
    color: #ef4e3a;
  }
  form input + i.icon.error {
    display: none;
    margin-left: 8px;
  }
  form select + i.icon.error {
    display: none;
    margin-left: 8px;
  }
  form.ng-submitted input.ng-invalid + i.icon.error {
    display: block;
  }
  form.ng-submitted select.ng-invalid + i.icon.error {
    display: block;
  }
  form .has-error {
    border-left: 3px solid #cc2511;
    border-right: 3px solid #cc2511;
  }
  form .has-success {
    border-left: 3px solid #3d8b3d;
    border-right: 3px solid #3d8b3d;
  }
  form.ng-submitted input.ng-valid + i.icon.error {
    display: none;
  }
  form.ng-submitted select.ng-valid + i.icon.error {
    display: none;
  }
  .validated {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -moz-flex;
    display: -ms-flexbox;
    display: flex;
    padding: 0px;
    width: 100%;
  }
  .validated .input-label {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 30%;
    -moz-box-flex: 0;
    -moz-flex: 0 0 30%;
    -ms-flex: 0 0 30%;
    flex: 0 0 30%;
    max-width: 30%;
  }
  .validated input {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 60%;
    -moz-box-flex: 0;
    -moz-flex: 0 0 60%;
    -ms-flex: 0 0 60%;
    flex: 0 0 60%;
    max-width: 60%;
  }
  .validated error {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 10%;
    -moz-box-flex: 0;
    -moz-flex: 0 0 10%;
    -ms-flex: 0 0 10%;
    flex: 0 0 10%;
    max-width: 10%;
  }
  .item-stacked-label i.icon.error {
    position: absolute;
    top: 10px;
    right: 10px;
  }
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<link rel="stylesheet" href="http://code.ionicframework.com/1.1.0/css/ionic.css">
<script src="http://code.ionicframework.com/1.1.0/js/ionic.min.js"></script>
<script src="http://code.ionicframework.com/1.1.0/js/ionic-angular.js"></script>
<script src="http://code.ionicframework.com/1.1.0/js/ionic.bundle.js"></script>

<div class="upage vertical-col left hidden" ng-app="myApp" ng-controller="AppController">
    <ion-header-bar class="bar inner-element uib_w_1 bar-positive bar-header" data-uib="ionic/header" data-ver="0">
        <div class="buttons widget-container content-area horiz-area wrapping-col"></div>
        <h1 class="title">Cadastro de Tratamento</h1>
        <div class="buttons widget-container content-area horiz-area wrapping-col">
            <div class="button-bar widget uib_w_16 d-margins" data-uib="ionic/button_bar" data-ver="0"></div>
        </div>
    </ion-header-bar>
    <br>
    <br>
    <div style="margin:10px;">
        <form  novalidate="novalidate" on-valid-submit="aposValidarDadosOK()">
            <label class="item item-input item-select widget uib_w_2 d-margins" data-uib="ionic/select" data-ver="0">
                <div class="input-label">Status</div>
                <select id="slc_Situacao" required ng-model="status">
                    <option></option>
                    <option>Ativo</option>
                    <option>Inativo</option>
                </select>
                <i class="icon ion-alert-circled error">*</i>
            </label>
            <br>
            <br>
            <label class="item item-input widget uib_w_3 d-margins borderObrigatorio" data-uib="ionic/input" data-ver="0" id="txt_Cliente">
                <i class="icon placeholder-icon ion-android-search ion"></i>
                <input type="text" placeholder="Cliente" ng-model="cliente" required>
                <i class="icon ion-alert-circled error col col-10">*</i>
            </label>
            <br>
            <br>
            <div>
                <button type="submit" class="button icon-right ion-chevron-right button-block button-energized active">
                    Próximo
                </button>
            </div>
        </form>
    </div>
</div>

OBS: Para visualizar o exemplo todo abre em modo Página toda. por algum motivo está cortando o botão próximo.

angular.module('myApp', ['ionic'])
  .directive('onValidSubmit', ['$parse', '$timeout',
    function($parse, $timeout) {
      return {
        require: '^form',
        restrict: 'A',
        link: function(scope, element, attrs, form) {
          form.$submitted = false;
          var fn = $parse(attrs.onValidSubmit);
          element.on('submit', function(event) {
            scope.$apply(function() {
              element.addClass('ng-submitted');
              form.$submitted = true;
              if (form.$valid) {
                if (typeof fn === 'function') {
                  fn(scope, {
                    $event: event
                  });
                }
              }
            });
          });
        }
      }

    }
  ])
  .directive('validated', ['$parse',
    function($parse) {
      return {
        restrict: 'AEC',
        require: '^form',
        link: function(scope, element, attrs, form) {
          var inputs = element.find("*");
          for (var i = 0; i < inputs.length; i++) {
            (function(input) {
              var attributes = input.attributes;
              if (attributes.getNamedItem('ng-model') != void 0 && attributes.getNamedItem('name') != void 0) {
                var field = form[attributes.name.value];
                if (field != void 0) {
                  scope.$watch(function() {
                    return form.$submitted + "_" + field.$valid;
                  }, function() {
                    if (form.$submitted != true) return;
                    var inp = angular.element(input);
                    if (inp.hasClass('ng-invalid')) {
                      element.removeClass('has-success');
                      element.addClass('has-error');
                    } else {
                      element.removeClass('has-error').addClass('has-success');
                    }
                  });
                }
              }
            })(inputs[i]);
          }
        }
      }
    }
  ]).controller('AppController', function($scope){
  $scope.aposValidarDadosOK = function(){
  console.log("Proximo.......")
  }
});
  #btn_Codigo,
  #btn_Nome,
  #btn_Sexo {
    display: none;
  }
  input.ng-dirty.ng-invalid {
    border: 1px solid red;
  }
  form i.icon.error {
    color: #ef4e3a;
  }
  form input + i.icon.error {
    display: none;
    margin-left: 8px;
  }
  form select + i.icon.error {
    display: none;
    margin-left: 8px;
  }
  form.ng-submitted input.ng-invalid + i.icon.error {
    display: block;
  }
  form.ng-submitted select.ng-invalid + i.icon.error {
    display: block;
  }
  form .has-error {
    border-left: 3px solid #cc2511;
    border-right: 3px solid #cc2511;
  }
  form .has-success {
    border-left: 3px solid #3d8b3d;
    border-right: 3px solid #3d8b3d;
  }
  form.ng-submitted input.ng-valid + i.icon.error {
    display: none;
  }
  form.ng-submitted select.ng-valid + i.icon.error {
    display: none;
  }
  .validated {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -moz-flex;
    display: -ms-flexbox;
    display: flex;
    padding: 0px;
    width: 100%;
  }
  .validated .input-label {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 30%;
    -moz-box-flex: 0;
    -moz-flex: 0 0 30%;
    -ms-flex: 0 0 30%;
    flex: 0 0 30%;
    max-width: 30%;
  }
  .validated input {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 60%;
    -moz-box-flex: 0;
    -moz-flex: 0 0 60%;
    -ms-flex: 0 0 60%;
    flex: 0 0 60%;
    max-width: 60%;
  }
  .validated error {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 10%;
    -moz-box-flex: 0;
    -moz-flex: 0 0 10%;
    -ms-flex: 0 0 10%;
    flex: 0 0 10%;
    max-width: 10%;
  }
  .item-stacked-label i.icon.error {
    position: absolute;
    top: 10px;
    right: 10px;
  }
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<link rel="stylesheet" href="http://code.ionicframework.com/1.1.0/css/ionic.css">
<script src="http://code.ionicframework.com/1.1.0/js/ionic.min.js"></script>
<script src="http://code.ionicframework.com/1.1.0/js/ionic-angular.js"></script>
<script src="http://code.ionicframework.com/1.1.0/js/ionic.bundle.js"></script>

<div class="upage vertical-col left hidden" ng-app="myApp" ng-controller="AppController">
    <ion-header-bar class="bar inner-element uib_w_1 bar-positive bar-header" data-uib="ionic/header" data-ver="0">
        <div class="buttons widget-container content-area horiz-area wrapping-col"></div>
        <h1 class="title">Cadastro de Tratamento</h1>
        <div class="buttons widget-container content-area horiz-area wrapping-col">
            <div class="button-bar widget uib_w_16 d-margins" data-uib="ionic/button_bar" data-ver="0"></div>
        </div>
    </ion-header-bar>
    <br>
    <br>
    <div style="margin:10px;">
        <form  novalidate="novalidate" on-valid-submit="aposValidarDadosOK()">
            <label class="item item-input item-select widget uib_w_2 d-margins" data-uib="ionic/select" data-ver="0">
                <div class="input-label">Status</div>
                <select id="slc_Situacao" required ng-model="status">
                    <option></option>
                    <option>Ativo</option>
                    <option>Inativo</option>
                </select>
                <i class="icon ion-alert-circled error">*</i>
            </label>
            <br>
            <br>
            <label class="item item-input widget uib_w_3 d-margins borderObrigatorio" data-uib="ionic/input" data-ver="0" id="txt_Cliente">
                <i class="icon placeholder-icon ion-android-search ion"></i>
                <input type="text" placeholder="Cliente" ng-model="cliente" required>
                <i class="icon ion-alert-circled error col col-10">*</i>
            </label>
            <br>
            <br>
            <div>
                <button type="submit" class="button icon-right ion-chevron-right button-block button-energized active">
                    Próximo
                </button>
            </div>
        </form>
    </div>
</div>

OBS: Para visualizar o exemplo, abra em modo Página toda. Por algum motivo está cortando o botão próximo.

angular.module('myApp', ['ionic']).directive('onValidSubmit', ['$parse', '$timeout',
function($parse, $timeout) {
    return {
        /* Define requisito diretiva, ou seja,  irá rodar dentro da tag form */
        require: '^form',
        restrict: 'A',
        /* Compila diretiva */
        link: function(scope, element, attrs, form) {
            form.$submitted = false;
            var fn = $parse(attrs.onValidSubmit);
            /* Atribui evento onsubmit no form relacionado a diretiva */
            element.on('submit', function(event) {
                scope.$apply(function() {
                    element.addClass('ng-submitted');
                    form.$submitted = true;
                    /* Verificar o estado dos campos que estão presente no form, ou seja, se estão validos de acordo com a validação denifida. Essa obdece o padrão do HTML5 com a tag required */
                    if (form.$valid) {
                        if (typeof fn === 'function') {
                            fn(scope, {
                                /* Chama funcão callback caso a validação esteja OK */
                                $event: event
                            });
                        }
                    }
                });
            });
        }
    };
}]).controller('AppController', function($scope){
    /* Funcao callback executada caso a validação retorne um OK */
    $scope.aposValidarDadosOK = function(){
        console.log("Proximo.......");
    };
});
#btn_Codigo,
  #btn_Nome,
  #btn_Sexo {
    display: none;
  }
  input.ng-dirty.ng-invalid {
    border: 1px solid red;
  }
  form i.icon.error {
    color: #ef4e3a;
  }
  form input + i.icon.error {
    display: none;
    margin-left: 8px;
  }
  form select + i.icon.error {
    display: none;
    margin-left: 8px;
  }
  form.ng-submitted input.ng-invalid + i.icon.error {
    display: block;
  }
  form.ng-submitted select.ng-invalid + i.icon.error {
    display: block;
  }
  form .has-error {
    border-left: 3px solid #cc2511;
    border-right: 3px solid #cc2511;
  }
  form .has-success {
    border-left: 3px solid #3d8b3d;
    border-right: 3px solid #3d8b3d;
  }
  form.ng-submitted input.ng-valid + i.icon.error {
    display: none;
  }
  form.ng-submitted select.ng-valid + i.icon.error {
    display: none;
  }
  .validated {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -moz-flex;
    display: -ms-flexbox;
    display: flex;
    padding: 0px;
    width: 100%;
  }
  .validated .input-label {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 30%;
    -moz-box-flex: 0;
    -moz-flex: 0 0 30%;
    -ms-flex: 0 0 30%;
    flex: 0 0 30%;
    max-width: 30%;
  }
  .validated input {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 60%;
    -moz-box-flex: 0;
    -moz-flex: 0 0 60%;
    -ms-flex: 0 0 60%;
    flex: 0 0 60%;
    max-width: 60%;
  }
  .validated error {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 10%;
    -moz-box-flex: 0;
    -moz-flex: 0 0 10%;
    -ms-flex: 0 0 10%;
    flex: 0 0 10%;
    max-width: 10%;
  }
  .item-stacked-label i.icon.error {
    position: absolute;
    top: 10px;
    right: 10px;
  }
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<link rel="stylesheet" href="http://code.ionicframework.com/1.1.0/css/ionic.css">
<script src="http://code.ionicframework.com/1.1.0/js/ionic.min.js"></script>
<script src="http://code.ionicframework.com/1.1.0/js/ionic-angular.js"></script>
<script src="http://code.ionicframework.com/1.1.0/js/ionic.bundle.js"></script>

<div class="upage vertical-col left hidden" ng-app="myApp" ng-controller="AppController">
    <ion-header-bar class="bar inner-element uib_w_1 bar-positive bar-header" data-uib="ionic/header" data-ver="0">
        <div class="buttons widget-container content-area horiz-area wrapping-col"></div>
        <h1 class="title">Cadastro de Tratamento</h1>
        <div class="buttons widget-container content-area horiz-area wrapping-col">
            <div class="button-bar widget uib_w_16 d-margins" data-uib="ionic/button_bar" data-ver="0"></div>
        </div>
    </ion-header-bar>
    <br>
    <br>
    <div style="margin:10px;">
        <form  novalidate="novalidate" on-valid-submit="aposValidarDadosOK()">
            <label class="item item-input item-select widget uib_w_2 d-margins" data-uib="ionic/select" data-ver="0">
                <div class="input-label">Status</div>
                <select id="slc_Situacao" required ng-model="status">
                    <option></option>
                    <option>Ativo</option>
                    <option>Inativo</option>
                </select>
                <i class="icon ion-alert-circled error">*</i>
            </label>
            <br>
            <br>
            <label class="item item-input widget uib_w_3 d-margins borderObrigatorio" data-uib="ionic/input" data-ver="0" id="txt_Cliente">
                <i class="icon placeholder-icon ion-android-search ion"></i>
                <input type="text" placeholder="Cliente" ng-model="cliente" required>
                <i class="icon ion-alert-circled error col col-10">*</i>
            </label>
            <br>
            <br>
            <div>
                <button type="submit" class="button icon-right ion-chevron-right button-block button-energized active">
                    Próximo
                </button>
            </div>
        </form>
    </div>
</div>
Fonte Link
Emir Marques
  • 3,6mil
  • 14
  • 24

Você pode usar uma diretiva do angular para validar conforme abaixo:

OBS: Para visualizar o exemplo todo abre em modo Página toda. por algum motivo está cortando o botão próximo.

angular.module('myApp', ['ionic'])
  .directive('onValidSubmit', ['$parse', '$timeout',
    function($parse, $timeout) {
      return {
        require: '^form',
        restrict: 'A',
        link: function(scope, element, attrs, form) {
          form.$submitted = false;
          var fn = $parse(attrs.onValidSubmit);
          element.on('submit', function(event) {
            scope.$apply(function() {
              element.addClass('ng-submitted');
              form.$submitted = true;
              if (form.$valid) {
                if (typeof fn === 'function') {
                  fn(scope, {
                    $event: event
                  });
                }
              }
            });
          });
        }
      }

    }
  ])
  .directive('validated', ['$parse',
    function($parse) {
      return {
        restrict: 'AEC',
        require: '^form',
        link: function(scope, element, attrs, form) {
          var inputs = element.find("*");
          for (var i = 0; i < inputs.length; i++) {
            (function(input) {
              var attributes = input.attributes;
              if (attributes.getNamedItem('ng-model') != void 0 && attributes.getNamedItem('name') != void 0) {
                var field = form[attributes.name.value];
                if (field != void 0) {
                  scope.$watch(function() {
                    return form.$submitted + "_" + field.$valid;
                  }, function() {
                    if (form.$submitted != true) return;
                    var inp = angular.element(input);
                    if (inp.hasClass('ng-invalid')) {
                      element.removeClass('has-success');
                      element.addClass('has-error');
                    } else {
                      element.removeClass('has-error').addClass('has-success');
                    }
                  });
                }
              }
            })(inputs[i]);
          }
        }
      }
    }
  ]).controller('AppController', function($scope){
  $scope.aposValidarDadosOK = function(){
  console.log("Proximo.......")
  }
});
  #btn_Codigo,
  #btn_Nome,
  #btn_Sexo {
    display: none;
  }
  input.ng-dirty.ng-invalid {
    border: 1px solid red;
  }
  form i.icon.error {
    color: #ef4e3a;
  }
  form input + i.icon.error {
    display: none;
    margin-left: 8px;
  }
  form select + i.icon.error {
    display: none;
    margin-left: 8px;
  }
  form.ng-submitted input.ng-invalid + i.icon.error {
    display: block;
  }
  form.ng-submitted select.ng-invalid + i.icon.error {
    display: block;
  }
  form .has-error {
    border-left: 3px solid #cc2511;
    border-right: 3px solid #cc2511;
  }
  form .has-success {
    border-left: 3px solid #3d8b3d;
    border-right: 3px solid #3d8b3d;
  }
  form.ng-submitted input.ng-valid + i.icon.error {
    display: none;
  }
  form.ng-submitted select.ng-valid + i.icon.error {
    display: none;
  }
  .validated {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -moz-flex;
    display: -ms-flexbox;
    display: flex;
    padding: 0px;
    width: 100%;
  }
  .validated .input-label {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 30%;
    -moz-box-flex: 0;
    -moz-flex: 0 0 30%;
    -ms-flex: 0 0 30%;
    flex: 0 0 30%;
    max-width: 30%;
  }
  .validated input {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 60%;
    -moz-box-flex: 0;
    -moz-flex: 0 0 60%;
    -ms-flex: 0 0 60%;
    flex: 0 0 60%;
    max-width: 60%;
  }
  .validated error {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 10%;
    -moz-box-flex: 0;
    -moz-flex: 0 0 10%;
    -ms-flex: 0 0 10%;
    flex: 0 0 10%;
    max-width: 10%;
  }
  .item-stacked-label i.icon.error {
    position: absolute;
    top: 10px;
    right: 10px;
  }
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<link rel="stylesheet" href="http://code.ionicframework.com/1.1.0/css/ionic.css">
<script src="http://code.ionicframework.com/1.1.0/js/ionic.min.js"></script>
<script src="http://code.ionicframework.com/1.1.0/js/ionic-angular.js"></script>
<script src="http://code.ionicframework.com/1.1.0/js/ionic.bundle.js"></script>

<div class="upage vertical-col left hidden" ng-app="myApp" ng-controller="AppController">
    <ion-header-bar class="bar inner-element uib_w_1 bar-positive bar-header" data-uib="ionic/header" data-ver="0">
        <div class="buttons widget-container content-area horiz-area wrapping-col"></div>
        <h1 class="title">Cadastro de Tratamento</h1>
        <div class="buttons widget-container content-area horiz-area wrapping-col">
            <div class="button-bar widget uib_w_16 d-margins" data-uib="ionic/button_bar" data-ver="0"></div>
        </div>
    </ion-header-bar>
    <br>
    <br>
    <div style="margin:10px;">
        <form  novalidate="novalidate" on-valid-submit="aposValidarDadosOK()">
            <label class="item item-input item-select widget uib_w_2 d-margins" data-uib="ionic/select" data-ver="0">
                <div class="input-label">Status</div>
                <select id="slc_Situacao" required ng-model="status">
                    <option></option>
                    <option>Ativo</option>
                    <option>Inativo</option>
                </select>
                <i class="icon ion-alert-circled error">*</i>
            </label>
            <br>
            <br>
            <label class="item item-input widget uib_w_3 d-margins borderObrigatorio" data-uib="ionic/input" data-ver="0" id="txt_Cliente">
                <i class="icon placeholder-icon ion-android-search ion"></i>
                <input type="text" placeholder="Cliente" ng-model="cliente" required>
                <i class="icon ion-alert-circled error col col-10">*</i>
            </label>
            <br>
            <br>
            <div>
                <button type="submit" class="button icon-right ion-chevron-right button-block button-energized active">
                    Próximo
                </button>
            </div>
        </form>
    </div>
</div>