2016-12-06 2 views
0

У меня есть файл .jsp с div, который я показываю/скрываю в соответствии со значением select. неИгнорировать div, скрытый в валидации

Если значение моего выбора «нет» скрыть DIV и если «да» показать DIV

Я использую нг-требуется если параметр необходим для проверки.

Но если значение «нет», и я проверяю свою форму, я не могу его проверить, потому что поле в div скрыто пусто.

Я тестирую что-то, но не получаю результата.

КОД

<div class="row" id="yesAuth"> 
    <div class="col-md-6" ng-class="{ 'has-error': invalid.basicAuthForBackendUsername, 'has-success': valid.basicAuthForBackendUsername}"> 
     <div class="form-group" > 
      <label for="basicAuthForBackendUsername">basic auth username *</label> 
      <input type="text" name="basicAuthForBackendUsername" class="form-control" placeholder="basic auth username" ng-model="api.basicAuthForBackendUsername" ng-required="true"> 
      <span id="helpBlock" class="help-block" ng-show="help.basicAuthForBackendUsername.required">basic auth username is required.</span>  
     </div>         
    </div> 
</div> 

JS

$(function() { 
     $("#basicAuth").change(function() { 
     if($("#basicAuth option:selected").val() == 'yes'){ 
      $('#yesAuth').show(); 
     } 
     else{ 
      $('#yesAuth').hide(); 
     } 
     }); 
    }); 

$("#basicAuth").validate({ 
    ignore: ".hidden" 
}); 

CSS

<style media="screen" type ="text/css"> 
    .hidden { 
     visibility: hidden; 
    } 
</style> 

Как я могу исправить мою проблему?

Большое спасибо.

ответ

1

Пожалуйста, используйте угловую проверку и используйте ng-if для отображения и скрыть div. В случае углового вы не должны использовать JS-код.

Вы можете легко сделать в угловую с помощью нг-если = «установить вы кондиционировать здесь»

И проверка не будет работать, когда элемент шкура (не отображается на DOM)

0

Вы должны использовать .removeAttribute() когда вы скрываете элемент и .setAttribute(), когда вы его показываете (из простого старого ванильного JavaScript).

$(function() { 
     $("#basicAuth").change(function() { 
     if($("#basicAuth option:selected").val() == 'yes'){ 
      $('#yesAuth').show(); 
      $('#basicAuthForBackendUsername').setAttribute("ng-required", "true"); 
     } 
     else{ 
      $('#yesAuth').hide(); 
      $('#basicAuthForBackendUsername').removeAttribute("ng-required"); 
     } 
     }); 
    }); 

Я не знаком с AngularJS, поэтому, пожалуйста, исправьте меня, если я ошибаюсь.

+0

Не работает для меня .. – JackR

0

я испытываю что-то подобное, но теперь, если значение «да», и я проверить свою форму в поле не проверяется в то время как он пуст ..

$(function() { 
    $('#yesAuth').hide(); 
    $("#basicAuth").change(function() { 
       if($("#basicAuth option:selected").val() == 'yes'){ 
          $('#yesAuth').show(); 
          $('#basicAuthForBackendUsername').attr("ng-required","true"); 
          $('#basicAuthForBackendPassword').attr("ng-required","true"); 
          alert("VOILA" + $('#basicAuthForBackendPassword').attr("ng-required")) 

       } 
       else{ 
          $('#yesAuth').hide(); 
          $('#basicAuthForBackendUsername').attr("ng-required","false"); 
          $('#basicAuthForBackendPassword').attr("ng-required","false"); 
          alert("VOILA" + $('#basicAuthForBackendPassword').attr("ng-required")); 
       } 
    }); 
}); 
Смежные вопросы