Tüm metin kutularını onaylayın İlk Tuşa tıklayın, ancak ikinci düğme için tıklayın Angular js'ye tıklayın

Question

Angular js. Bir html sayfasında birkaç metin kutusu ve iki düğmenin (Arama, Tümünü Göster) var. Arama düğmesine tıklamak için tüm metin kutuları onaylanmalı ve ShowAll'a tıklanmadan önce herhangi bir doğrulama yapılmamalıdır. Modellerin her birinin adını (1) 'de validations grubu gibi (gibi) belirtmeden metin kutularının arkasındaki tüm modelleri doğrulamak istiyorum Net). Bu açısal js içinde mümkün mü? Burada bir ajax mesajı yapıyorum.

<div ng-controller="myCtrl"> 
 
<table> 
 
       <tr id="dvTransactionSearch"> 
 
        <td align="right"> 
 
         Message ID : 
 
        </td> 
 
        <td align="left"> 
 
         <input type="text" style="width: 170px;" id="txtmessageId" ng-model="MessageId" /> 
 
        </td> 
 
        <td align="right"> 
 
         Consumer ID : 
 
        </td> 
 
        <td align="left"> 
 
         <input type="text" style="width: 170px;" id="txconsumerId" ng-model="ConsumerId" /> 
 
        </td> 
 
</tr> 
 
<tr> 
 
        
 
        <td align="left"> 
 
         <input type="button" id="btnSearch" value="Search" ng-click="Search()" /> 
 
         <input type="button" value="Show All" id="btnShowAll" ng-click="ShowAll()" /> 
 
         
 
        </td>     
 
       </tr> 
 
</table> 
 
</div>

Answer 1

Eğer açısal doğrulamaları kullanarak, html kendisi bunu doğrulamak ve size ng özürlü olarak kullanarak geçerli bir girdi almak kadar teslim düğme devre dışı tutabilir:

<div ng-controller="myCtrl"> 
    <form name="messageForm" novalidate> 
    <table> 
     <tr id="dvTransactionSearch"> 
      <td align="right"> 
       Message ID : 
      </td> 
      <td align="left"> 
       <input type="text" style="width: 170px;" name="txtmessageId" id="txtmessageId" ng-model="MessageId" required/> 
       <div ng-messages="messageForm.txtmessageId.$error" ng-if="messageForm.$submitted || messageForm.txtmessageId.$touched"> 
         <div ng-message="required"> Enter Text message ID</div> 
       </div> 
      </td> 
      <td align="right"> 
       Consumer ID : 
      </td> 
      <td align="left"> 
      <input type="text" style="width: 170px;" name="txconsumerId" id="txconsumerId" ng-model="ConsumerId" /> 
       <div ng-messages="messageForm.txconsumerId.$error" ng-if="messageForm.$submitted || messageForm.txconsumerId.$touched"> 
         <div ng-message="required"> Enter Consumer ID</div> 
       </div> 
      </td> 
     </tr> 
     <tr>    
      <td align="left"> 
       <input type="button" id="btnSearch" ng-disabled="messageForm.$invalid" value="Search" ng-click="Search()" /> 
       <input type="button" value="Show All" ng-disabled="messageForm.$invalid" id="btnShowAll" ng-click="ShowAll()" /> 

      </td>     
     </tr> 
    </table> 
    </form> 
</div>