Hello,

I am currently trying to use the "jQuery Form Validator" plugin (http://formvalidator.net/) with my form wizard. Upon pressing the "Next" button, it should validate the input fields for the current step. And of course, a user should not be able to proceed to the next step or submit the form without all of the fields passing validaton.

When an input field has failed validation, the class "error" is added to it. I am not sure how to check the input fields for the current step for that class, and disable/enable the "Next" button. Is that the best method?

Here is my psuedocode:
Code:
<form>
<div class="form-wizard">
Step 1
<input fields>
</div>

<div class="form-wizard">
Step 2
<input fields>
</div>

<div class="form-button-bar">
<button class="btn btn-default btn-small form-wizard-previous" id="previous"><i class="icon-circle-arrow-left"></i> Previous</button>&nbsp;
<button class="btn btn-success btn-small form-wizard-next" id="nextbutton"><i class="icon-circle-arrow-right"></i> Next</button>
<button class="btn btn-success btn-small form-wizard-submit form-submit-ajax" id="formSubmitAjax"><i class="icon-external-link"></i> Submit</button>
</div>
</form>