jQuery Validation Plugin: Invoke errorPlacement function when onfocusout, keyup and click
- by th3hamburgler
Hi,
I am using the jquery validation plugin and want to use the errorPlacement function to add error messages to the fields title attribute and display just a ? next to the field.
This works great when the form is submitted with the submit button but when any of the following events are triggered:
- onfocusout
- click
- onkeyup
The validation checks are run but it skips the errorPlacement function and adds the full error message after the field, like the default behaviour.
I am using the following code:
$("#send-mail").validate({
debug: true,
// set this class to error-labels to indicate valid fields
success: function(label) {
// set text as tick
label.html("✔").addClass("valid");
},
// the errorPlacement has to take the table layout into account
errorPlacement: function(error, element) {
console.log("errorPlacement called for "+element.attr("name")+" field");
// check for blank/success error
if(error.text() == "")
{
// remove field title/error message from element
element.attr("title", "");
console.log("error check passed");
}
else
{
// get error message
var message = error.text();
// set as element title
element.attr("title", message);
// clear error html and add cross glyph
error.html("✘");
console.log("error check failed: "+message);
}
// add error label after form element
error.insertAfter(element);
},
ignoreTitle: true,
errorClass: "invalid"
});
