Home >Web Front-end >JS Tutorial >angularjs+ionic registration page form verification
Function:
After verification of the mobile phone number and password format, the judgment of whether the two password inputs are the same is correct and the checkbox can be clicked to register and enter. tabs.mypage page.
Not performedVerification codeReally send, obtain the background verification code data and compare it with the input verification code.
Use:
##4-- novalidate: Disable execution of <form> form native verification to avoid conflict with the verification method you set
7-- type="number": Limit the input number type; required: Limit cannot be empty; ng-minlength/ng-maxlength: Limit the minimum and maximum length of input characters
11-- type= "password":Semantic, password format;ng-pattern="/[a-zA-Z0-9]/": Enter numbers or letters using regular rules
ng-click="getTestCode()": Bind click Event ; ng-bind="description": Control button to display text; ng-disabled="canClick": Control button availability to avoid short Multiple requests within time
ng-show="": Display prompt text according to conditions; registerForm. number: The input box named number in the
ng-disabled="registerForm.$invalid":
Note:Do not add click events in the
手机号 输入密码 确认密码 验证码 手机号输入有误 密码输入格式有误 两次密码输入不一致 同意发货么用户协议 注册
Function: Click to trigger to obtain the verification codeFunction, no request can be sent again during the 59s countdown.
Note: Remember to inject $interval# in the controller
##1 $scope.canClick=false; 2 $scope.description="获取验证码"; 3 var second=59; 4 var timerHandler; 5 $scope.getTestCode=function(){10 timerHandler=$interval(function(){11 if(second<=0){12 $interval.cancel(timerHandler);13 second=59;14 $scope.description="获取验证码";15 $scope.canClick=false;16 }else{17 $scope.description=second+"s后重发";18 second--;19 $scope.canClick=true;20 }21 },1000)22 };
The above is the detailed content of angularjs+ionic registration page form verification. For more information, please follow other related articles on the PHP Chinese website!