How to validate each step in fuelux wizard using jquery-validate
<p>How can I validate each step of a fuelux wizard (when clicking next button)?</p>

<p>jquery code for the function is like this.</p>

<pre><code>$('#myWizard').on('actionclicked.fu.wizard', function (evt, data) {
    // validation code for the step here.
    // jquery validator, AFAIK validates  only the whole form.
    // in this case, only the ancestor div

    // had tried this
    var curstep = $('#myWizard').wizard('selectedItem');
    var curstepcontainer = $(this).closest(".step-pane");

    curstepcontainer.validate();

   // and this
   if (curstep.step === 1)
   {
       $('#field1').validate();
       $('#field2').validate();
   }
});
</code></pre>

<p>Both didnt work.</p>

<p>While this approach may be a way to make it work, Is there any other ideal way to do this?</p>

<p>I understand from <a href="https://collegeparktutors.com/get-tutor?course_dropdown=19" rel="nofollow">https://collegeparktutors.com/get-tutor?course_dropdown=19</a> that this can be done.</p>

<p>Have also checked out formvalidation.io (<a href="http://formvalidation.io/examples/fuel-ux-wizard/" rel="nofollow">http://formvalidation.io/examples/fuel-ux-wizard/</a>) that they have a great working code for this, which solves our issue. However, this is a commercial product, and we are exploring open source  / free tools :-)</p>

<p>Any pointers, help, suggestions appreciated!
Thanks!</p>