jquery confirm password validation

Question

I am using jquery for form validation. Rest is well except the confirm password field. Even when the same password is typed, the Please enter the same password. is not removed.

My script is:

  <script type="text/javascript">
    $(document).ready(function() {
      $("#form1").validate({
        rules: {
          password: { 
                required: true, minlength: 5
          }, 
          c_password: { 
                required: true, equalTo: "#password", minlength: 5
          }, 
        email: {
          required: true, email: true
          },
        phone: {
          required: true, number: true, minlength: 7
          },
        url: {
          url: true
        },
        description: {
          required: true
        },
        gender: {
             required: true
          }
        },
        messages: {
         description: "Please enter a short description.",
         gender: "Please select your gender."

        }
      });
    });
     -->
  </script>

And inside the form tag:

<div class="form-row"><span class="label">Password</span><input type="password" name="password" class="required" id="password" /></div>

<div class="form-row"><span class="label">Confirm Password</span><input type="password" name="c_password" id="c_password" /></div>

Any suggestion? Would be much thankful for the help.

Answer 1

Your fields doesn't have the ID property. In jQuery the "#password" selector means "the object that has an id property with value 'password' "

Your code should look like this:

<input type="password" name="password" id="password" class="required"/>

Answer 2

<input type="password" id="password" class="nomal required error" value="" name="cpassword">

<input type="password" equalto="#password" class="nomal required error" value="" name="cpassword">

Answer 3

rules: {

isn't closed. Put another } after:

messages: {
   description: "Please enter a short description.",
   gender: "Please select yor gender."
}

This is as well as the answer about the element ID's.

Answer 4

确保您的密码的输入文本具有id'密码'

Answer 5

请确保在同一页面中没有标记为id='password'其他输入。

Answer 6

I came across some issues when using camelCase id's for the password inputs. I finnally got it working with different 'name' and 'id'.

<input type="password" id="pass" placeholder="New password" name="newPassword">
<input type="password" id="pass2" placeholder="New password" name="repeatNewPassword">
<input type="email" id="inputNewEmail" name="newEmail" placeholder="New email">
<input type="email" id="repeatNewEmail" name="repeatNewEmail" placeholder="New email>

Then in the JS:

rules: {
            newPassword: {
                minlength: 6
            },
            repeatNewPassword: {
                minlength: 6,
                equalTo: "#pass"
            },
            newEmail: { email: true},
            repeatNewEmail: {email: true, equalTo: '#inputNewEmail'},
}

So refer to the input field by its 'name' but define equalTo deppendency using 'id'. I'm not sure about the camelCase issue, for the email inputs it worked, but exactly same nomenclature with password inputs didn't work, according to my experience

Answer 7

if($("#newpassword").val()!== ($("#conformpassword").val())){
    $('#newpasswordId').html('<font color="red">Your password does not match</font>');
    $("#newpassword").val('');
    $("#conformpassword").val('');
    $('#newpassword').css("border", "#FF0000 solid 1px")
    $('#conformpassword').css("border", "#FF0000 solid 1px")
    $("#newpassword").focus();

    return false;
}