Validate subset of a form using jQuery Validate plugin

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}

I tried this solution and it didn't work for me. So here is how i achieved same behaviour, using jquery.validation plugin.

The validator:

var form = $('#form');    // init validator obj and set the rules    form.validate({        errorElement: 'span', //default input error message container        errorClass: 'help-inline', // default input error message class        focusInvalid: false, // do not focus the last invalid input        ignore: "",        rules: {            // the rules, as usual        },        highlight: function (element) { // hightlight error inputs            $(element).closest('.control-group').addClass('error'); // set error class to the control group        },        unhighlight: function (element) { // revert the change dony by hightlight            $(element)                .closest('.control-group').removeClass('error'); // set error class to the control group        }    });

Using bootstrap form wizard.

This is how i validate each step:

$('#step :input').valid()

Works like a charm.

If you look at the options for the validate() function one of the options is ignore, which by default will prevent the validator from attempting to validate any fields that match the CSS pseudo-class :hidden. I used this in combination with the FuelUX Wizard and was able to prevent the wizard from progressing to the next step with the following:

$( '#wizard' ).wizard().on( 'change', function( event, info ) {    if ( ! $( '#wizard_form' ).valid() ) event.preventDefault();});