Click the input box to display the user name prompt. Click the Register Now button to display an error prompt under the input box
<form class="form-horizontal" name="checkForm" ng-init="isEmpty=false;">
<p class="form-group">
<label class="col-sm-3 control-label">用 戶 名</label>
<p class="col-sm-8 account">
<input type="text" class="form-control showHide" placeholder="您的賬戶名和登錄名"
ng-model="account"
name="account"
required="required"
ng-pattern="regularList.account"
ng-blur="checkForm.account.$blured = false;"
ng-focus="checkForm.account.$blured = true;"
autocomplete="off"/>
<span ng-class="{'right':(checkForm.account.$error.pattern),'error':checkForm.account.$valid}"></span>
</p>
<span ng-messages="isEmpty && checkForm.account.$blured && checkForm.account.$error" role="alert">
<span class="error_text" ng-message="required" style="color: #ff0000">用戶名不能為空</span>
</span>
<span ng-messages="checkForm.account.$blured && checkForm.account.$error" role="alert">
<span class="error_text" ng-message="pattern"style="color: #ff0000">用戶名為4-20位中文數(shù)字與英文字母組成!</span>
</span>
</p>
<p class="tip-container" ng-if="checkForm.account.$blured==true">
<p class="input-tip" ng-show="checkForm.account.$blured">
<i></i>
<span>!支持中文、字母、數(shù)字、“-”“_”的組合,4-20個(gè)字符</span>
</p>
</p>
The specific effects are as follows
Now I am entering content and I don’t want an error message to be displayed
My current problem is that when I enter the corresponding content, there will be an error message. The effect is as follows
Purpose: No error will be prompted when entering content. Click to register immediately. If it does not meet the corresponding specifications, an error will be prompted again.
Please give me some advice, thank you
認(rèn)證高級(jí)PHP講師
Also drunk. . .
<input type="text" class="form-control showHide" placeholder="Your account name and login name"
ng-model="account"
ng-pattern="regularList.account"/>
<span ng-show="showAccountError" role="alert">
<span class="error_text" style="color: #ff0000">用戶名為4-20位中文數(shù)字與英文字母組成!</span>
</span>
When the user submits, use regular expressions in the controller to determine whether $scope.account is legal. If it is not legal, set $scope.showAccountError=true. Set false to this variable when the page is initialized.