Denys Medynskyi
Denys Medynskyi

Reputation: 2353

Password confirmation trouble with jQuery validation plugin

I can't get why my code doesn't working, password confirmation doesn't ask - "password need confirmation".

My js code:

    $(document).ready(function(){
$('.new_user').validate({
    debug: true,
    rules: {
        'user[email]':{
            required: true
        },
        'user[password]': {
            required: true,
            'user[password_confirmation]': {
                equalTo: "#user_password"
            }
        }

},

showErrors: function(errorMap, errorList) {
    this.defaultShowErrors();
},
success: "valid"

});
})   

My html code:

   <div><label for="user_password">Password</label><br>
   <input id="user_password" name="user[password]" size="30" type="password" class="error"><label for="user_password" generated="true" class="error" style="">This field is required.</label></div>

      <div><label for="user_password_confirmation">Password confirmation</label>
<input id="user_password_confirmation" name="user[password_confirmation]" size="30" type="password"></div>

Upvotes: 2

Views: 4586

Answers (1)

Tats_innit
Tats_innit

Reputation: 34117

Working demo http://jsfiddle.net/g45fM/1/

This version in demo is way cleaner then what you are trying, also your HTML has missing form in it.

Hope this helps.

code

$.validator.setDefaults({
    submitHandler: function() {
        alert("submitted!");
    }
});

// validate signup form on keyup and submit
$("form").validate({
    rules: {
        pass: {
            required: true,
            minlength: 5
        },
        pass2: {
            required: true,
            minlength: 5,
            equalTo: "#pass"
        }
    },
    messages: {
        pass: {
            required: "Please provide a password",
            minlength: "Your password must be at least 5 characters long"
        },
        pass2: {
            required: "Please provide a password",
            minlength: "Your password must be at least 5 characters long",
            equalTo: "Please enter the same password as above"
        }
    }
});​

Upvotes: 3

Related Questions