如何使用angular js验证器执行下拉控件验证

How to perform dropdown control validation with angular js validator?

本文关键字:验证 控件 执行 angular js 何使用      更新时间:2023-09-26

我正在进行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;
    };

});