javascript - Password Match with Angular.js -
i try create form validation. new @ angular.js. copied code samples couldn't make work.
here html , script:
<body ng-app="myapp"> <script src= "http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script> <h2>validation example</h2> <form name="myform" novalidate> <p>username:<br> <input type="text" name="user" ng-model="user" required> <span style="color:red" ng-show="myform.user.$dirty && myform.user.$invalid"> <span ng-show="myform.user.$error.required">username required.</span> </span> </p> <p>email:<br> <input type="email" name="email" ng-model="email" required> <span style="color:red" ng-show="myform.email.$dirty && myform.email.$invalid"> <span ng-show="myform.email.$error.required">email required.</span> <span ng-show="myform.email.$error.email">invalid email address.</span> </span> </p> <label for="password"> password</label> <input type="password" name="password" ng-model="password" placeholder="new password"/> <label for="confirmpassword">confirm password</label> <input type="password" name="confirmpassword" placeholder="confirm password" ng-model="confirmpassword" pw-check="password"/> <span class="error" ng-show="myform.password.$error.pwmatch"> passwords don't match. </span> <p> <input type="submit" ng-disabled="myform.user.$dirty && myform.user.$invalid || myform.email.$dirty && myform.email.$invalid"> </p> </form> <script> var app = angular.module('myapp', []); app.directive('pwcheck', function () { return { require: 'ngmodel', link: function (scope, elem, attrs, ctrl) { scope.$watch(attrs.pwcheck, function (confirmpassword) { var isvalid = ctrl.$viewvalue === confirmpassword; ctrl.$setvalidity('pwmatch', isvalid); }); } } }); </script> </body> can tell me wrong ?
from know directive, @dcodesmith's solution correct. try one:
<input type="password" name="confirmpassword" placeholder="confirm password" ng-model="confirmpassword" pw-check="password"/> update. sorry previous snippet. check out. works:
<input type="password" name="password" ng-model="password" placeholder="new password" pw-check="confirmpassword"/> <input type="password" name="confirmpassword" placeholder="confirm password" ng-model="confirmpassword"/> js
link: function (scope, elem, attrs, ctrl) { scope.$watch(attrs.pwcheck, function (password) { var isvalid = ctrl.$viewvalue === password; ctrl.$setvalidity('pwmatch', isvalid); }); }
Comments
Post a Comment