1

I am trying to validate both passwords field and checking that both of them match but the form still gives an error even if both input boxes have the same password.

JS

var validator = $("#signupform").validate({
  rules: {
    password: {
      required: true,
      minlength: 6
    },

    repeatpassword: {
      required: true,
      minlength: 6,
      equalTo: "#password"
    }

  },
  messages: {
    password: {
      required: "Provide a password",
      minlength: jQuery.format("Enter at least {0} characters")
    },
    repeatpassword: {
      required: "Repeat your password",
      minlength: jQuery.format("Enter at least {0} characters"),
      equalTo: "Your passwords do not match"
    }
  },
});

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="col-xs-12 col-sm-6 col-md-6">
  <div class="form-group">
    <input type="password" name="password" id="password" class="form-control input-lg" placeholder="Password" tabindex="5">
  </div>
</div>
<div class="col-xs-12 col-sm-6 col-md-6">
  <div class="form-group">
    <input type="password" name="repeatpassword" id="repeatpassword" class="form-control input-lg" placeholder="Confirm Password" tabindex="6">
  </div>
</div>
7
  • Well equalTo is in repeatpassword input box Commented Apr 20, 2015 at 22:40
  • Is your validator inside $(document).ready(function() ? Commented Apr 20, 2015 at 22:43
  • 1
    watch this video on this page: jqueryvalidation.org Commented Apr 20, 2015 at 22:45
  • I think your repeatpassword should be confirm_password Commented Apr 20, 2015 at 22:45
  • whats in the name it should not matter Commented Apr 20, 2015 at 22:51

1 Answer 1

2

Not sure if you knew this but, "It is absolutely required that you have <form></form> tags for the jQuery Validate plugin to function properly, or at all." Read More

So I added a form tag.

What I think the issue with the passwords was, your were doing this:

jQuery.format("Enter at least {0} characters")

There is an error in console:

"$.format has been deprecated. Please use $.validator.format instead.";

So I changed your code to:

jQuery.validator.format("Enter at least {0} characters")

var validator = $("#signupform").validate({
  rules: {
    password: {
      required: true,
      minlength: 6
    },

    repeatpassword: {
      required: true,
      minlength: 6,
      equalTo: "#password"
    }

  },
  messages: {
    password: {
      required: "Provide a password",
      minlength: jQuery.validator.format("Enter at least {0} characters")
    },
    repeatpassword: {
      required: "Repeat your password",
      minlength: jQuery.validator.format("Enter at least {0} characters"),
      equalTo: "Your passwords do not match"
    }
  },
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.13.1/jquery.validate.min.js"></script>
<form id="signupform">
  <div class="col-xs-12 col-sm-6 col-md-6">
    <div class="form-group">
      <input type="password" name="password" id="password" class="form-control input-lg" placeholder="Password" tabindex="5">
    </div>
  </div>
  <div class="col-xs-12 col-sm-6 col-md-6">
    <div class="form-group">
      <input type="password" name="repeatpassword" id="repeatpassword" class="form-control input-lg" placeholder="Confirm Password" tabindex="6">
    </div>
  </div>
  <input type="submit" value="Submit">
</form>

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

4 Comments

Does not solves the problem the error gets displayed even when both the passwords are same
That is not happening in the code snippet above, but sorry it did not help you.
You are right it is working but on my website it is displaying the error. And my files get uploaded automatically when a change is made so there is not issue with the files transfer. But thanks for help
@Jonast92 you are right my sign In password field was being matched with my sign up password field sorry about that

Your Answer

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