Checking form input values with jquery

Viewed 81

I have a form that I want jquery to check and see if the input/select values with a class of required (These classes are in the #customerForm form) are blank. If they are I would like to prevent the form from submitting and change the color of the input/select box to red. If all of the input/select values with a class of required do have values, I would like to submit the form, fade the form inputs out and and fadeIn the next form. Here's my code:

$('#customerForm').submit(function (event) {
    var value = $('.required').each();
    if (value === "") {
        value.addClass("invalid");
        return false;
    } else {
        value.removeClass("invalid");
        $('#billForm, #shipForm').fadeOut();
        $('#payment-form').fadeIn();
    }
}); 

The problem is the form doesn't check for the input values and submits the form anyways. Any help would be amazing.

3 Answers
Related