How setup the jQuery validator plugin

Question

I'm trying to work with the bassistance jQuery validator plugin without success.

I don't understand how to set a specific input for validation:

<script>
$(document).ready(function(){
    $("#form-id").validate({
        username_id: { required:true },
        password_id: { required:true, minlength:8 },
        confirm_id:  { required:true, minlength:8, equalTo:"#password_id" }
    },
    messages: {
        username_id: "Missing username",
        password_id: {
            required: "Missing password",
            minlength: "Password short (5 chars min required)"
        },
        confirm_id: {
            required: "Missing password",
            minlength: "Password short (5 chars min required)",
            equalTo: "Password mismatch"
        }
    });
});
</script>    
<form id="form-id" etc>
    <input id="username_id" name="data[User][username]"><br>
    <input id="password_id" name="data[User][password]"><br>
    <input id="confirm_id" name="data[User][confirm]"><br>
    <input type="submit" value="Register">
</form>

this validator allways write class='valid' in the input i test? I'm sure the problem is in the object name, because I don't understand if I should set the id or the name attribute to let the plugin work properly.

Every tutorial I've found always use identical names for id and name attribute, so I can't understand where I'm wrong.

I've also the problem my name attribute come from cakephp, so my input form name attribute is like data[User][username] and I don't know how to use it with the plugin.

How can I fix it?

PS: I'm using jquery 1.6.1, I see the examples uses the 1.3.2 but firebug doesn't return any error.

Answer 1

You have to use the name attribute, and because they have the square brackets, you need to quote the names like this:

$("#form-id").validate({
    'data[User][username]': { required:true },
    //same for your other fields
},
messages: {
    'data[User][username]': "Missing username",
});