Angularjs 禁用angular js中的默认表单输入错误
如何禁用文本输入框下方默认显示的输入错误消息 这是我的表格：Angularjs 禁用angular js中的默认表单输入错误,angularjs,Angularjs,如何禁用文本输入框下方默认显示的输入错误消息 这是我的表格： <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <script src="${pageContext.request.contextPath}/js/Registratonvalidation.j
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script src="${pageContext.request.contextPath}/js/Registratonvalidation.js"></script>
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
<script>
angular.module('myApp', []).controller("numOnlyRegex", function ($scope)
{
$scope.numOnlyRegex = /^\d{1,6}$/;
$scope.cityArray = ["hyderabad", "secunderabad", "delhi", "mumbai"];
}
.controller('FormSubmitController', function($scope) {
$scope.submit = function($event)
{
if ($scope.myForm.$invalid)
{
$scope.myForm.$submitted = true;
$event.preventDefault();
}
}); </script>
<!--<script src="${pageContext.request.contextPath}/numOnlyRegex.js"></script>-->
<title>Registration Form</title>
</head>
<body>
<div class="container">
<div class="col-md-6 col-md-offset-3">
<div class="panel panel-login">
<div class="panel-body">
<div class="row">
<div class="col-lg-12">
<h2 class="text-muted">Registration form</h2>
<!--onSubmit="return validate()"-->
<div ng-app="myApp" ng-controller="FormSubmitController" >
<form name="myForm" action="RegistrationServlet.do" method="POST" >
First name:<input type="text" class="form-control input-sm" name="uname" ng-pattern="/^[a-zA-Z]{3,20}/" ng-model="uname" placeholder="First Name" required/>
<span style="color:red" ng-show="myForm.uname.$error.pattern">First name cannot be less than 3 letters with no digits</span>
<!--<p ng-show="myForm.uname.$invalid && !userForm.name.$pristine" class="help-block">Your name is required.</p>-->
<br/>
Last name:<input type="text" class="form-control input-sm" name="lname" ng-model="lname" name="uname" ng-pattern="/^[a-zA-]{3,20}/" required placeholder="Last Name"/>
<span style="color:red" ng-show="myForm.lname.$error.pattern">First name cannot be less than 3 letters with no digits</span><br/>
<p>Password:
<input type="password" class="form-control input-sm glyphicon glyphicon-ok" name="pwd" ng-minlength="3" ng-model="pwd" required placeholder="Password"/>
<span style="color:red" ng-show="myForm.pwd.$error.minlength">password cannot be less than 3 letters</span><br/>
Confirm Password:<input type="password" class="form-control input-sm glyphicon glyphicon-ok" name="pwd2" ng-minlength="3" ng-model="pwd2" required placeholder="Confirm Password"/><br/>
<span style="color:red" ng-show="myForm.pwd2.$error.minlength">password cannot be less than 3 letters</span><br/>
Gender: <input type="radio" name="female" ng-model="color" value="female" ng-required="!color"/>Female <input type="radio" name="male" ng-model="color" value="male" ng-required="!color"/>Male <br/><br/>
Mobile:<input type="text" class="form-control input-sm" name="mobile" ng-pattern="/^[7-9][0-9]{1,9}$/" ng-model="mobile" required placeholder="Mobile"/>
<span style="color:red" ng-show="myForm.mobile.$error.pattern">Please enter a valid mobile number</span><br/>
Email:<input type="email" class="form-control input-sm" name="email" ng-pattern="/\S+@\S+\.\S+/" ng-model="email" required placeholder="Email"/>
<span style="color:red" ng-show="myForm.email.$error.pattern">Invalid email address</span><br/>
Address:<textarea class="form-control input-sm" name="address" ng-model="address" required placeholder="Address"></textarea>
<span style="color:red" ng-show="myForm.address.$error.require == true">Address cannot be empty</span><br/>
Street:<input type="text" class="form-control input-sm" name="street" ng-model="street" required placeholder="Street"/>
Area:<input type="text" class="form-control input-sm" name="area" ng-model="area" required placeholder="Area"/><br/>
City: <select name="citySelection" ng-model="city" ng-options="city for city in cityArray" name='city' required>
<option value="">Select city</option>
</select>
<span ng-show="myForm.citySelection.$error.required"></span>
<br/><br/>
State: <input type="text" class="form-control input-sm" name="state" ng-model="state" required placeholder="State"/>
Country: <input type="text" class="form-control input-sm" name="country" ng-model="country" required placeholder="Country"/>
Pin:<input type="text" class="form-control input-sm" ng-pattern="numOnlyRegex" name="pin" ng-model="pin" required placeholder="Pin"/>
<span style="color:red" ng-show="myForm.pin.$error.pattern">Only six-digit number is allowed</span>
<!--<input type="Submit" class="form-control btn btn-success" ng-submit="submit($event)" value="Submit" />-->
<button type="submit" class="form-control btn btn-success" ng-click="submit($event)">Submit</button>
<!--ng-disabled="myForm.$invalid"-->
</form>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
角度.module（'myApp'，[]）.controller（'numOnlyRegex'，function（$scope）
{
$scope.numOnlyRegex=/^\d{1,6}$/；
$scope.cityArray=[“海得拉巴”、“塞坎德拉巴德”、“德里”、“孟买”]；
}
.controller（'FormSubmitController'，函数（$scope）{
$scope.submit=函数（$event）
{
if（$scope.myForm.$invalid）
{
$scope.myForm.$submitted=true；
$event.preventDefault（）；
}
});
登记表
登记表
名字：
名字不能少于3个没有数字的字母
姓氏：
名字不能少于3个没有数字的字母
密码：
密码不能少于3个字母
确认密码：
密码不能少于3个字母
性别：女男
流动电话：
请输入有效的手机号码
电邮：
无效的电子邮件地址
地址:
地址不能为空
街道：
面积：
城市：
选择城市
声明：
国家：
别针：
只允许使用六位数字
提交
function validateMethod() {
$scope.isValidated = true;
if($scope.uname == '') {
$scope.isValidated = false ;
}
//other custom validations
return $scope.isValidated;
}
var valid = validateMethod();
if(valid)
{
$scope.submit = function($event)
{
if ($scope.myForm.$invalid)
{
$scope.myForm.$submitted = true;
$event.preventDefault();
}
});
}
从文本输入框中删除“required”。如果我删除“required”，则表单将不会检查是否为空/未填充values@kittu您的代码中有很多错误。这就是为什么它不能按照您的期望工作。请参阅此更新的plunk，我仅修改了第一个字段的代码（uname）。它将在tab out上进行验证。但我使用regex作为名字etcys，这将与ng模式一起处理，您自己提到表单不会检查空/未填充的值，这会有所帮助。我的意思是所有字段都是必需的，并且每个字段都有regex模式。我想在输入为incor时显示错误消息当存在不正确的输入时，不应提交rect（用户在中键入）和表单（注意：我不希望使用禁用的ng）