How to perform dropdown control validation with angular js validator?

Question

I am doing angular js dropdown validation but getting problem when doing dropdown validation.

I have taken everything from this website and using this code: https://github.com/turinggroup/angular-validator

But in the above link there is nothing like doing validation on Dropdwon control.So if anybody have use this same code for doing dropdown validation and if successfull then please do guide me.

This is the plunker i have created which includes dropdown:

MyDropdownControlFullDemo

And this is my dropdown code:

     <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' };

What i want that if user doesnt select any option from dropdown then validation should appear just like validation appears for textbox control.

Shailendra Singh Deol · Accepted Answer · 2016-03-29 12:38:15Z

1

You need to change your code like as -

in Html for select list-

    <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>

And Controller will look like as-

 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;
    };



});

answered Mar 29, 2016 at 12:38

Shailendra Singh Deol

6373 silver badges5 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

I Love Stackoverflow Over a year ago

you solution is not working correctly like what happens if i take one textox and one dropdown control with you code then entering any value in textbox control and not selecting anything but still my form get submitted on click of button submit

Collectives™ on Stack Overflow

How to perform dropdown control validation with angular js validator?

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related