AngularJs- Form validation directive. The password confirm is always invalid -
i have signup form in ionic app (the code available here), signup view has own controller. password confirm has directive check match main password. register button disabled till form valid. the form never becomes valid. the password_c
input invalid.
<ion-view view-title="register form"> <ion-content> <form ng-submit="signup()" name="regform" novalidate> <div> <label for="email" .....></label> <label for="password" ......></label> <label for="password_c"> <input type="password" id="password_c" name="password_c" ng-model="registerform.password_c" valid-password-c required> <span ng-show="regform.password_c.$error.required && regform.password_c.$dirty">please confirm password.</span> <span ng-show="!regform.password_c.$error.required && regform.password_c.$error.nomatch && regform.password.$dirty">passwords not match.</span> </label> <button type="submit" ng-disabled="!regform.$valid"> </div> </form> </ion-content> </ion-view>
and directive:
.directive('validpasswordc', function () { return { require: 'ngmodel', link: function (scope, elm, attrs, ctrl) { ctrl.$parsers.unshift(function (viewvalue, $scope) { var nomatch = viewvalue != scope.regform.password.$viewvalue ctrl.$setvalidity('nomatch', !nomatch) }) } } })
i console.log
ng-show
condition; when passwords matchs, condition becomes undefined.
console.log(!regform.password_c.$error.required && regform.password_c.$error.nomatch && regform.password.$dirty)
separately; first .required
become undefined .nomatch
i can't test now, believe $parsers
expects return value unless have parser error.
try add return
in code:
ctrl.$parsers.unshift(function (viewvalue) { var nomatch = viewvalue != scope.regform.password.$viewvalue; ctrl.$setvalidity('nomatch', !nomatch); return viewvalue; });
Comments
Post a Comment