驗證jquery下拉插件不能使用角js

我想在我的下拉列表中添加角js驗證，這是一個jQuery插件。但我的驗證不起作用。它沒有顯示錯誤消息時，我採用了棱角分明js-驗證jquery下拉插件不能使用角js

不選擇任何option.I現在用下面的驗證

<div class="form-group" ng-class="{ 'has-error' : userForm.mySelect.$invalid && !userForm.mySelect.$pristine }"> 
    <label for="Question" style="color:#767676" class="" ng-hide="userForm.mySelect.$invalid && !userForm.mySelect.$pristine">Choose a security Question</label> 
         <label class="error_message_text" ng-show="userForm.mySelect.$invalid && !userForm.mySelect.$pristine"> 
         Please choose a security Question 
         </label><br> 
<div class="company-dropdown clearfix" style=" padding-left: 2px;"> 
          <div class="form-group"> 
           <select name="mySelect" id="select" class="form-control" required> 
            <option value="">Please select a security question</option> 
            <option value="option-1">Which is your favourite sport?</option> 
            <option value="option-2">Where did you born?</option> 
           </select> 
          </div> 
    </div></div>

誰能告訴我，我將如何做到這一點？我在這裏創建了一個plunker- https://plnkr.co/edit/wrS7gWnWruTo7wzu7tTh?p=preview

來源

2016-07-14 Aanchal

解釋更多你的意思是隱藏和顯示？ – Erez

是的，我的意思是ng-hide和ng-show不能用於下拉菜單。 @Erez – Aanchal

當我在plnkr上看到您的代碼時，有兩個錯誤。你爲什麼要在驗證使用

你的表單名稱是myForm的，那麼「userForm.mySelect。$無效」，這應該是myForm.mySelect。$無效。所以到處都要用myForm替換userForm。
爲您的選擇帶一個ng-model變量。

因此，您的代碼將如下所示。

  <body ng-app=""> 
      <div class="container registration-form"> 
      <form name="myForm" novalidate> 
      <h3 style="color: #818285;">Login</h3> 
      <br> 

      <div class="form-group" ng-class="{ 'has-error' : myForm.name.$invalid && !myForm.name.$pristine }"> 

      <label for="UserName" style="color:#767676" class="" ng-hide="myForm.name.$error.required && !myForm.name.$pristine ">Name</label> 
      <label class="error_message_text" ng-show="myForm.name.$error.required && !myForm.name.$pristine"> 
      Please enter the name 
      </label> 
      <input type="text" name="name" class="form-control" ng-model="user.planNo" required> 

      </div> 
      <div class="form-group" ng-class="{ 'has-error' : myForm.mySelect.$invalid && !myForm.mySelect.$pristine }"> 
      <label for="Question" style="color:#767676" class="" ng-hide="myForm.mySelect.$invalid && !myForm.mySelect.$pristine">Choose a security Question</label> 
      <label class="error_message_text" ng-show="myForm.mySelect.$invalid && !myForm.mySelect.$pristine"> 
      Please choose a security Question 
      </label><br> 
      <div class="company-dropdown clearfix" style=" padding-left: 2px;"> 
      <div class="form-group"> 
      <select name="mySelect" ng-model="user.mySelect" id="select" class="form-control" required> 
      <option value="">Please select a security question</option> 
      <option value="option-1">Which is your favourite sport?</option> 
      <option value="option-2">Where did you born?</option> 
      </select> 
      </div> 
      </div></div> 
      </form> 
      </div> 
      <script> 
      $(document).ready(function (e) { 
      try { 

      $("#select").msDropDown(); 
      } catch (e) { 
      alert(e.message); 
      } 
      </script> 

      </body>

現在這工作正常。檢查它在 https://plnkr.co/edit/ae0qVMvZDPCgsilEwFSL?p=preview

來源

2016-07-14 10:45:26 localhost

驗證jquery下拉插件不能使用角js

回答

相關問題