0

Why is my password and confirm password validation not working? It works fine in JS Fiddle but not working my program

Here's the Js fiddle link

    <!DOCTYPE html>
<html ng-app="myApp" >
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <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>
            var app = angular.module('myApp', []);

            app.controller('MainCtrl', function ($scope) {
                $scope.cityArray = ["hyderabad", "secunderabad", "delhi", "mumbai"];
                $scope.submit = function ($event) {
                    if ($scope.myForm.$invalid) {
                        // Or some other update
                        $scope.myForm.$submitted = true;
                        $event.preventDefault();
                    }
                }
            });

            app.directive('nxEqualEx', function () {
                return {
                    require: 'ngModel',
                    link: function (scope, elem, attrs, model) {
                        if (!attrs.nxEqualEx) {
                            console.error('nxEqualEx expects a model as an argument!');
                            return;
                        }
                        scope.$watch(attrs.nxEqualEx, function (value) {
                            // Only compare values if the second ctrl has a value.
                            if (model.$viewValue !== undefined && model.$viewValue !== '') {
                                model.$setValidity('nxEqualEx', value === model.$viewValue);
                            }
                        });
                        model.$parsers.push(function (value) {
                            // Mute the nxEqual error if the second ctrl is empty.
                            if (value === undefined || value === '') {
                                model.$setValidity('nxEqualEx', true);
                                return value;
                            }
                            var isValid = value === scope.$eval(attrs.nxEqualEx);
                            model.$setValidity('nxEqualEx', isValid);
                            return isValid ? value : undefined;
                        });
                    }
                };
            });
        </script>

        <title>Registration Form</title>
    </head>
    <body ng-controller="MainCtrl">
        <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>
                                <div>
                                    <form name="myForm" action="RegistrationServlet.do" method="POST" novalidate>

                                        Password:
                                        <input type="password" nx-equal-ex="pwd" class="form-control" name="pwd" ng-model="pwd" required placeholder="Password"/>
                                          <span style="color:red" ng-show="form.pwd.$error.nxEqualEx">Must be equal!</span>

                                        Confirm Password:<input type="password" nx-equal-ex="pwd2" class="form-control" ng-model="pwd2" name="pwd2" required placeholder="Confirm Password"/>
                                        <span style="color:red" ng-show="form.pwd2.$error.nxEqualEx">Must be equal!</span>

                                        <button class="form-control btn btn-success" type="submit" ng-click="submit($event)">Submit</button>
                                    </form>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>            
    </body>
</html>
8
  • possible duplicate of AngularJS password confirmation noMatch not working? Commented Jun 23, 2015 at 11:45
  • No its not. Yes I got the code from SO but applying the same directive in my project is not working. I checked all the typos and field names but its not working? What did I miss? Commented Jun 23, 2015 at 11:47
  • Any error in the console ? Commented Jun 23, 2015 at 11:49
  • Didn't find any errors in console Commented Jun 23, 2015 at 11:51
  • I just copy paste your code and it's working fine :) Commented Jun 23, 2015 at 11:58

1 Answer 1

0

If I understand correctly, you should be using this:

nx-equal-ex="pwd"

instead of

nx-equal-ex="pwd2"
Sign up to request clarification or add additional context in comments.

1 Comment

Open the js file in console and put a breakpoint on this line: var isValid = value === scope.$eval(attrs.nxEqualEx); Let me know what you see in valid and scope.$eval(attrs.nxEqualEx)

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.