jQuery validate plugin: validate on blur() by default

Question

Okay, so I get that jQuery Validate is opinionated about when (not) to validate on blur:

Before a field is marked as invalid, the validation is lazy: Before submitting the form for the first time, the user can tab through fields without getting annoying messages – they won't get bugged before having the chance to actually enter a correct value

Is there a way to override this behavior? I want each field to be validated whenever it loses focus, not just after there's an error.

Answer 1

jQuery Validation is "Lazy" validation by default. This means that, before the submit is clicked the first time, much of the validation is ignored when moving from field to field.

You're requesting "Eager" validation, so simply over-ride the onfocusout default with a custom function...

$('#yourForm').validate({
    // rules, options, etc.,
    onfocusout: function(element) {
        // "eager" validation
        this.element(element);  
    }
});

Documentation: http://jqueryvalidation.org/validate/#onfocusout

Additional Reference: https://stackoverflow.com/a/28114269/594235

Default onfocusout function:

onfocusout: function(element) {
    // "lazy" validation by default
    if (!this.checkable(element) && (element.name in this.submitted || !this.optional(element))) {
        this.element(element);
    }
},