Validate subset of a form using jQuery Validate plugin

Question

My HTML form has a number of divs that are the steps of a wizard. Upon clicking a "next" button I want to validate just the active div. I'm using the jQuery.Validate.js plugin.

Each div has an ID, so I want a way to say something like:

wizardForm.validate().element('#first-step :input')

but this only validates the first input, not all of them. How can I validate all inputs within a div?

Answer 1

EDIT

maybe try this:

$('#first-step').find('input').each(function(){
   wizardForm.validate.element($(this));
});

Kind Regards

--Andy

Answer 2

Taking what jAndy suggested, I created this helper function:

jQuery.validator.prototype.subset = function(container) {
    var ok = true;
    var self = this;
    $(container).find(':input').each(function() {
        if (!self.element($(this))) ok = false;
    });
    return ok;
}

usage:

if (wizardForm.validate().subset('#first-step')) {
    // go to next step
}