使用AngularJS进行表单验证

<form name="myForm"  ng-submit="addForm()" novalidate>

     <div class="form-group">

        <label>名称</label>

        <input type="text" name="userName" placeHolder="名称" ng-minlength="3"

           ng-maxlength="20" required>

         <div class="m-t-xs" ng-show="myForm.userName.$invalid && myForm.submitted">

               <small class="text-danger" ng-show="myForm.userName.$error.required">

                      请输入

              </small>

              <small class="text-danger" ng-show="myForm.userName.$error.minlength">

                      名称最小长度为3                                

               </small>

                <small class="text-danger" ng-show="myForm.userName.$error.maxlength">

                       名称最大长度为20

                </small>

         </div>

    </div>

    <div class="form-group">

            <button type="submit">保存</button>

     </div>

</form>

$scope.addForm = function(){

    if($scope.myForm.$valid){

        //提交表单

    }else{

         $scope.myForm.submitted = true;//显示错误提示信息

    }

}

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值