AngularJs必填、比较、格式验证

最新推荐文章于 2024-06-20 10:37:21 发布

漫彧明柒

最新推荐文章于 2024-06-20 10:37:21 发布

阅读量7k

点赞数 1

分类专栏： AngularJs 文章标签： angularjs 验证

本文链接：https://blog.csdn.net/qq_31971935/article/details/52575039

版权

AngularJs 专栏收录该内容

9 篇文章 0 订阅

订阅专栏

界面：

  <form name="form" ng-submit="submitReg(tel,password,yzmsr,form)" novalidate="novalidate" >
                <!-- <h3><img src="/img/reh3.png" alt=""></h3> -->
                <div class="tb">
                    <dl class="sjh">
                        <dt>手机号</dt><dd><select name="" id=""><option value="">+86</option></select><input type="text" name="sjh" id="phone" ng-model="tel" ng-minlength="11"  required ng-pattern="/^1[3|4|5|7|8]\d{9}$/">
                        <p ng-show="form.submitted" class="error">                         
                               <small ng-show="form.sjh.$error.required">请输入手机号</small>
                                <small ng-show="form.sjh.$error.pattern">请填写正确的手机号</small>
                        </p>
                        </dd>   
                    </dl>
                    <dl class="yzm">
                        <dt>验证码</dt><dd><input type="text" ng-model="yzmsr" id="yzms"><button ng-click="yzm(tel)" class="hqyzm" type="button">获取验证码</button></dd>
                    </dl>
                    <dl>
                        <dt>输入密码</dt><dd><input type="password" id="password" name="password" ng-model="password" ng-minlength="6" ng-maxlength="20" required ng-pattern="/^[A-Za-z0-9]+$/">
                        <p ng-show="form.submitted" class="error">                    
                                <small ng-show="form.password.$error.required">请输入密码只能为6-20位字母与数字的组合</small>
                                <small ng-show="form.password.$error.minlength">密码长度最低6个字符</small>
                                <small ng-show="form.password.$error.maxlength">密码长度最高20个字符</small>
                                <small ng-show="form.password.$error.pattern">密码只能为6-20位字母与数字的组合</small>
                        </p>
                        </dd>
                    </dl>
                    <dl>
                        <dt>确认密码</dt><dd>
                        <input name="repassword" ng-model="formData.repassword" id="repassword" type="password" pw-check="password" required >
                        <p ng-show="form.submitted" class="error">                      
                              <small ng-show="form.repassword.$error.required">请输入密码只能为6-20位字母与数字的组合</small>
                                <small ng-show="form.repassword.$error.minlength">密码长度最低6个字符</small>
                                <small ng-show="form.repassword.$error.maxlength">密码长度最高20个字符</small>
                                <small ng-show="form.repassword.$error.pattern">密码只能为6-20位字母与数字的组合</small>
                                <small ng-show="form.repassword.$error.pwmatch">密码和确认密码不一致!!</small>
                        </p>
                        </dd>
                    </dl>
                </div>
                <div class="btn">
                    <button type="submit">确认注册</button>
                </div>
            </form>

脚本：

.controller('RegisterCtrl', function($scope, $http, $ionicPopup, $location, $window, myACcountsID, access_token, refresh_token, myDisplayName, myPhone, myPassword) {
    $scope.submitReg = function(t, p, y, form) {
        //判断数据是否完善
        //注册
        if(form.$valid) {
        //验证通过执行代码
        } else {
        //验证未通过
            form.submitted = true;
        }
}