jQuery Validate - Require at least one from group, plus additional items.

Question

I'm attempting to use 'jQuery Validate' on a form that requires an email address plus either all items of a shipping address completed or none at all.

Using the sample provided by the solution to this question: jQuery Validate - “Either skip these fields, or fill at least X of them”, I have been able to successfully solve the validation of the address group.

The problem, however, is that the logic for validating the email address field does not work. From debugging the Validate scripts, the "re-entrant" validation code triggered by calling 'fields.data('being_validated', true).valid();' in the linked example results in a reset of all previously validated errors (i.e. the email validation error is cleared).

I have modified some existing samples, the first in which removes the offending line and the second with it included.

Email Validation Working

Email Validation Fails

Any tips or suggestions on how to properly solve this or work around the failure?

Answer 1

In your case, I'd change a few things around:

1) set jQuery.validate({ onsubmit: false }), because you don't want validation to run by default, you want to control when validation runs.

2) Fire validation on your own terms during form submit like so:

$("form").submit(function() {
    $("emailField").validate();
    if ($("emailField").valid())
    {
        $("form").validate();
        return $("form").valid();
    }
    return $("emailField").valid();
});

I may not understand your requirements fully, but hopefully this will at least help you look at the solution from a different perspective.