Angular JS | Angular Validation Match Password

Question

I am attempting to use angular-validation-match from https://github.com/TheSharpieOne/angular-validation-match. I am unable to get the match term to trigger to cause any type of form validation. Right now even if the passwords are different it will not show that the passwords do not match. Any reason this may be? Below is the html.

  <form name="vm.changeForm"
        ng-submit="vm.changeForm.$valid && vm.attemptChange(password);"
        >
    <md-input-container class="md-block">
      <input required
             type="password"
             placeholder="New Password"
             name="passwordName"
             ng-model="password"
             />
      <div ng-messages="vm.changeForm.passwordConfirm.$error"
           ng-if="vm.changeForm.passwordConfirm.$touched"
           role="alert"
           >
        <div ng-message="required">Please enter a password.</div>
      </div>
    </md-input-container>
    <md-input-container class="md-block">
      <input required
             type="password"
             placeholder="Confirm New Password"
             name="myConfirmField"
             ng-model="passwordConfirm"
             match="password"
             />

      <div ng-show="vm.changeForm.passwordConfirm.$error.match"
           ng-if="vm.changeForm.passwordConfirm.$touched"
           role="alert">Passwords do not match</div>


    </md-input-container>
  </form>

developer033 · Accepted Answer · 2016-07-06 19:44:57Z

2

Notes:

You're using ng-if and ng-show on the same div, which isn't necessary, you can simply into a simple ng-if.
You have to use the name property instead of the ng-model.

So, since your input name is myConfirmField you must replace this:

<div ng-show="vm.changeForm.passwordConfirm.$error.match" ng-if="vm.changeForm.passwordConfirm.$touched" role="alert">Passwords do not match</div>

for:

<div ng-if="vm.changeForm.myConfirmField.$touched && vm.changeForm.myConfirmField.$error.match" role="alert">Passwords do not match</div>

Then you should get the expected result.

edited Jul 6, 2016 at 19:44

answered Jul 6, 2016 at 19:31

developer033

25k8 gold badges85 silver badges113 bronze badges

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

Collectives™ on Stack Overflow

Angular JS | Angular Validation Match Password

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related