Question

96

ng-pattern doesn't show $error.pattern

rated 0 times [ 98] [ 2] / answers: 1 / hits: 37604 / 9 Years ago, thu, august 13, 2015, 12:00:00

I have script here and ng-pattern works correctly because scope.subnet is shown in Output only after input matches pattern. But ng-show doesn't display any error if ng-pattern is not matched

<body ng-contoller=myConfigGenCtr>

  <form novalidate name=myForm>

            <div class=form-group>

                <label for=hostname>Firewall hostname</label>

                <input type=text ng-model=hostname class=form-control id=hostname>

            </div>

            <div class=form-group>

                <label for=subnet>Firewall subnet</label>

                <input type=text ng-model=subnet class=form-control id=subnet

                       required ng-pattern=/^(?:[0-9]{1,3}.){3}/ >

                <div class=custom-error  ng-show=myForm.subnet.$error.pattern>

                    Not a valid subnet, should be i.e. 10.x.y. (3 bytes only)</div>

            </div>

        </form>

  <div>Output: {{subnet}}</div>      

</body>

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

alorafrancisl

Add To Favorites

Follow

Total Points: 80

Total Questions: 96

Total Answers: 102

Location: Ukraine

Member since Sun, Dec 13, 2020

4 Years ago

answered 9 Years ago briannar · Accepted Answer

When you add form tag with its name, angular does create a scope variable for that name attribute value & do add all the form fields of the form which have name attributes. Those fields attribute variable get created inside form scope object. Like here you are using myForm that means $scope.myFrom has all the information about the form fields. like its validity using $valid, $invalid, $error, etc.

Here you are using ng-show=myForm.subnet.$error.pattern on subnet element of form. You missed to add name=subnet attribute on input field, that turns out to subnet element validation doesn't available inside myForm scope variable.

Markup

<input type=text name=subnet ng-model=subnet class=form-control 

id=subnet required ng-pattern=/^(?:[0-9]{1,3}.){3}/ >

Working Plunkr