如何使用angular.js

时间:2015-10-27 04:17:14

标签: javascript angularjs forms validation

我有一个疑问。我需要在提交时检查表单是否正确验证使用angular.js.我已添加ng-message来验证字段。我正在解释下面的代码。< / p>

<form name="billdata" id="billdata"  enctype="multipart/form-data" novalidate>
<div class="input-group bmargindiv1 col-md-12">
<span class="input-group-addon ndrftextwidth text-right" style="width:180px">Email Id :</span>
<input type="email" name="email" id="contactno" class="form-control" placeholder="User email" ng-model="user_email" >
</div>
<div class="help-block" ng-messages="billdata.email.$error" ng-if="billdata.email.$touched">
<p ng-message="email" style="color:#F00;">This needs to be a valid email</p>
 </div>
<div class="input-group bmargindiv1 col-md-12">
<span class="input-group-addon ndrftextwidth text-right" style="width:180px">Mobile No :</span>
<input type="text" name="mobno" id="contactno" class="form-control" placeholder="Mobile No" ng-model="mob_no" ng-minlength="10" ng-maxlength="10" >
</div>
<div class="help-block" ng-messages="billdata.mobno.$error" ng-if="billdata.mobno.$touched">
<p ng-message="minlength" style="color:#F00;">This field is too short.The min length of your mob no should be 10.</p>
<p ng-message="maxlength" style="color:#F00;">This field is too long.The max length of your mob no should be 10.</p>
</div>
</div>
<div class="clearfix"></div>    
<div style="text-align:center; padding-top:10px;">
<input type="button" class="btn btn-success" ng-click="addUserData();"  id="addProfileData" ng-value="buttonName"  />
<!-- <button class="btn btn-success" type="button" ng-click="addCourseData();">Submit</button>-->
</div>
</form>

在这里,我可以得到正确的验证信息。但在这里我的要求是当用户点击提交按钮时它将如何检查表格字段是否有正确的数据。请帮助我。

1 个答案:

答案 0 :(得分:0)

如果您只想知道表单是否有效,那么您可以轻松使用以下代码。您可以将表单名称作为参数发送,然后在函数中添加以下代码。

 $scope.adduserData = function(billdata){
       if(billdata.$valid){
       }else{
       } 
 }  


  <input type="button" class="btn btn-success" ng-click="addUserData(billdata);"/>