This makes it very difficult to determine which element is causing the
error and execute code in response.

For instance, the following does not work, because there is no way to
determin which input caused the error because the errorClass has not
been set yet when invalidHandler is called:

$('#step_1_form').validate({
        rules: {
                category_selector: "required",
                zip_code: "required"
        },
        messages: {
                category_selector: ""
        },
        invalidHandler: function() {
                if 
($('select[name^="category_selector"][class*="error"]').length >
0)
                {
                        // EXECUTE SOME CODE SPECIFIC TO THIS ERROR
                }
        }
}


A work around is to use setTimeout, but is obviously an undesirable
hack:

$('#step_1_form').validate({
        rules: {
                category_selector: "required",
                zip_code: "required"
        },
        messages: {
                category_selector: ""
        },
        invalidHandler: function() {
                var displayErrors = function() {
                        if 
($('select[name^="category_selector"][class*="error"]').length >
0)
                        {
                                // EXECUTE SOME CODE SPECIFIC TO THIS ERROR
                        }
                };
                setTimeout(displayErrors,10);
        }
}


Am I correct? or is there a better way to determine the element
causing the error, and regardless, shouldn't errorClass be set before
invalidHandler is called anyways?

Reply via email to