I was wondering how to display a single error message above the form instead of individual field messages. like this form has http://jquery.bassistance.de/validate/demo/marketo/step2.htm
I know it has something to do with handles but not exactly sure how or where to put them
<script>
$(document).ready(function(){
$("#valform").validate();
});
</script>
this is the code i have that uses all default validation
You should use invalidHandler for this functionality. Something like this should do:
$("#myform").validate({
invalidHandler: function(form, validator) {
var errors = validator.numberOfInvalids();
if (errors) {
$("#error-message").show().text("You missed " + errors + " field(s)");
} else {
$("#error-message").hide();
}
}
});
Example: http://jsfiddle.net/KheRr/1/
If you want to hide the default error messages, you should specify "" as the error message for the field and validation type:
$("#myform").validate({
invalidHandler: function(form, validator) {
var errors = validator.numberOfInvalids();
if (errors) {
$("#error-message").show().text("You missed " + errors + " field(s)");
} else {
$("#error-message").hide();
}
},
messages: {
field1: {
required: "" // You'll have to do this for each field and validation type.
}
}
});
Example: http://jsfiddle.net/KheRr/2/
