Question

I am using the JQuery validation plugin. I am providing a custom showError function as so:

var errorHandler = function(errorMap, errorList) {
    console.log("count: " + this.errorList.length);

    var text = "";
    if (this.errorList.length > 0) {
      text = "Please correct the following errors: ";
      for (var i = 0; i < this.errorList.length; i++) {
        text += "* " + this.errorList[i].message.errorCode + "<br>";
      }
    }
    $('#oopDialogErrorContainer').html(text);
    this.defaultShowErrors();
}

My issue is that I would like to have access to ALL existing errors in the form. The form has many fields, but when errorHandler is called (this function is passed to validate() as the showError option), the errorList contains only the errors from the field last validated. In examining the validator object, there is nowhere that all current errors are stored. Do I need to manage this myself? (It seems so but I might be missing something.

Answer 1

http://docs.jquery.com/Plugins/Validation/validate#options

errorLabelContainer

Hide and show this container when validating.

“All error labels are displayed inside an unordered list with the ID “messageBox”, as specified by the selector passed as errorContainer
option. All error elements are wrapped inside an li element, to create
a list of messages.”

$("#myform").validate({
   errorLabelContainer: "#messageBox",
   wrapper: "li",
   submitHandler: function() { alert("Submitted!") }
})

and…

errorContainer

Hide and show this container when validating.

“Uses an additonal container for error messages. The elements given as the errorContainer are all shown and hidden when errors occur. But
the error labels themselve are added to the element(s) given as
errorLabelContainer, here an unordered list. Therefore the error
labels are also wrapped into li elements (wrapper option).”

$("#myform").validate({
   errorContainer: "#messageBox1, #messageBox2",
   errorLabelContainer: "#messageBox1 ul",
   wrapper: "li", debug:true,
   submitHandler: function() { alert("Submitted!") }
})