如何使用angular js验证器执行下拉控件验证
How to perform dropdown control validation with angular js validator?
我正在进行angular js下拉验证,但在进行下拉验证时遇到了问题。
我已经从这个网站上拿走了所有东西,并使用了这个代码:https://github.com/turinggroup/angular-validator
演示
但在上面的链接中,没有什么比在Dropdwon控件上进行验证更好的了。因此,如果有人使用相同的代码进行下拉验证,如果成功,请指导我。
这是我创建的plunker,其中包括下拉列表:
MyDropdownControlFullDemo
这是我的下拉代码:
<select class="form-control m-b-sm" required ng-model="form.Obj" ng-options="c.Name for c in Obj track by c.Id">
</select>
$scope.Obj = [
{Id : '0', Name : 'Select' },
{Id : '1', Name : 'USA' },
{Id : '2', Name : 'Canada' },
{Id : '3', Name : 'Russia' } ];
}
$scope.Obj = { Id: '0', name: 'Select' };
我想要的是,如果用户没有从下拉列表中选择任何选项,那么验证应该像文本框控件的验证一样出现。
您需要将代码更改为-
在Html中选择列表-
<select class="form-control m-b-sm" name="selectbox" required-message="'Yo! This field is required..'"
required ng-model="form.Obj" ng-options="c.Name for c in Objlist track by c.Id">
<option value="">Select</option>
</select>
控制器将看起来像-
angular.module('angular-validator-demo').controller('DemoCtrl',function($scope){
$scope.Objlist = [
{Id : '0', Name : 'Select' },
{Id : '1', Name : 'USA' },
{Id : '2', Name : 'Canada' },
{Id : '3', Name : 'Russia' } ];
$scope.Obj = { Id: '0', name: 'Select' };
$scope.submitMyForm = function(){
alert("Form submitted");
};
$scope.myCustomValidator = function(text){
return true;
};
$scope.anotherCustomValidator = function(text){
if(text === "rainbow"){
return true;
}
else return "type in 'rainbow'";
};
$scope.passwordValidator = function(password) {
if(!password){return;}
if (password.length < 6) {
return "Password must be at least " + 6 + " characters long";
}
if (!password.match(/[A-Z]/)) {
return "Password must have at least one capital letter";
}
if (!password.match(/[0-9]/)) {
return "Password must have at least one number";
}
return true;
};
});
相关文章:
- 如何在cakepp中使用javascript验证我的html表单控件
- ASP.net控件中的其他客户端验证
- 如何使用angular js验证器执行下拉控件验证
- TextBox自定义Web控件和JavaScript客户端验证
- 关闭已禁用表单控件的验证 角度
- 在 Web 浏览器中禁用 Javascript 应禁用服务器验证控件
- 在提交表单之前更改控件背景颜色,但如何在验证通过时重置颜色
- Javascript 验证控件
- 禁用隐藏面板中的asp验证控件
- JavaScript Conform对话框不工作,如果我放入Asp.Net验证控件
- 触发验证器使用js验证控件
- 如何在几个ASP上显示/隐藏错误消息?. NET验证控件
- 使用asp.net验证控件时,禁用回发按钮
- 如何在JavaScript中识别和检查验证控件
- 我们如何使用使用Javascript和asp验证控件
- 如何让验证控件和自定义javascript验证函数一起工作
- 同时触发onclientclick和客户端验证,从客户端单击按钮的验证控件
- 如何从客户端启动所有验证控件
- 电话验证控件
- ASP.NET 验证控件和 Javascript 确认框