How can I show errors in jQuery validation?

Question

Do we have any function which returns all the error messages while validating a form?

I have tried using the defaultshowerros() function but it returns the error message for the element it is currently validating. How can I get all the error messages of the whole form?

Answer 1

If you store a reference to the validator, for example:

var validator = $("form").validate();

You can call .errors() or .invalidElements() at any time on it, for example:

var errors = validator.errors(); //get the error elements, the actual labels
var errors = validator.invalidElements(); //the invalid elements themselves

If you're not really after the errors and just want them to appear in once place, use the built-in errorLabelContainer and wrapper options, for example:

<ul id="errors"></ul>

And reference that:

$("form").validate({ errorLabelContainer: "#errors", wrapper: "li" });

And your errors would appear all in that list, which is also automatically shown/hidden if there are/aren't any errors.

Answer 2

The validation plugin should show an error beside the field where the error is. Are you using id's for your input boxes? If so use a name as well and give jquery the value of the name attribute in your rules and messages. Hope this helps.

Answer 3

Late to the party, but I found you can also instantiate the validate() object with a invalidHandler() function:

var $jqvForm = $(".jqvForm").validate({
    invalidHandler: function(e, validation){
        console.log("invalidHandler : event", e);
        console.log("invalidHandler : validation", validation);
    }
});

The validation variable contains a variable invalid (object) with form items and their error messages.