jQuery validation plugin: How to create your own messages

Question

I am using jquery validation plugin with php on ubuntu.

I am applying validation on my forms like this:

$(obj).find("form").validate();

When I set "email" as class of any text field and I give it a wrong formated email address, it show the following error like this.

Please enter a valid email address.

Question: Above message is very lengthy and damage the alignment of my form and table. I want to use very short messages like this.

required
invalid email
invalid phone number
etc.

I have tried this but it is showing its own messages not mine.

$(obj).find("form").validate({

     messages: {
         required: "Required.",
         email: "Invalid email",
         url: "Invalid URL."
     }

    });

can any one tell me how should I do this? What is the exact code. "Messages" option is not working for me. Thanks

Answer 1

Messages option should work. See this question.

Answer 2

What are the names of your input elements? See how the key in messages object relates to name attribute of the input element not to the name of the class. This is crucial

<form id="commentForm" method="get" action="">
    <fieldset>
        <input id="iname" name="nname" size="25" class="required" minlength="2" /><br />
        <input id="iemail" name="nemail" size="25"  class="required email" /><br />
        <input id="iurl" name="nurl" size="25"  class="url" /><br />
        <input class="submit" type="submit" value="Submit"/>
    </fieldset>
</form>

$(document).ready(function() {
    $("#commentForm").validate({
        messages: {
            nname: "Required",
            nemail: "Invalid email",
            ncomment: "Invalid URL"
        }
    });
});

You can also specify different messages for different errors

$("#commentForm").validate({
    messages: {
        nname: "Required",
        nemail: {
            required: "Email needed",
            email: "Invalid email"
        },
        ncomment: "Invalid URL"
    }

});