Difference between errorContainer and errorLabelContainer options in jQuery Validate

Question

Using ErrorLabelContainer I can display all the errors on my page in a single div.

What is the use of errorContainer?

Answer 1

Please refer to official documentation where all this is clearly explained.

errorLabelContainer - All error labels are displayed inside an unordered list with the ID “messageBox”, as specified by the selector passed as errorContainer option.

In other words, as an example, the errorLabelContainer contains the errors as an unordered list. This unordered list goes inside of the errorContainer.

Example usage:

$('form').validate({
    errorContainer: "#messageBox1",
    errorLabelContainer: "#messageBox1 ul",
    wrapper: "li"
});

Will yield this markup...

<div id="messageBox1">                 <!- errorContainer ->
    <ul>                               <!- errorLabelContainer ->
        <li>Field is required</li>     <!- wrapper ->
        <li>Enter a valid email</li>   <!- wrapper ->
    </ul>
</div>

To play around with how this works, you could create a jsFiddle demo and inspect the DOM to see how the rendered HTML is constructed.