title: Validating a multi-page form with parsley.js
body: <p>I am working with the multi-page form found <a href="http://thecodeplayer.com/walkthrough/jquery-multi-step-form-with-progress-bar" rel="nofollow">here</a> and trying to validate the fieldsets using parsley.js. I have followed their steps on their examples page for a multi-page form but I run into one of two problems:</p>
  
  <p>1) It won't prompt for non-filled in fields until I hit submit and then will show the errors when I hit previous or
  2) When I click on Next I get an error in the console that says it's an undefined function on "next_fs.show();"</p>
  
  <p>Here is the form code followed below by a link to all my current code in a fiddle.</p>
  
  <pre><code>    &lt;!-- multistep form --&gt;
  &lt;form id="msform" data-parsley-validate&gt;
      &lt;!-- progressbar --&gt;
      &lt;ul id="progressbar"&gt;
          &lt;li class="active"&gt;Account Setup&lt;/li&gt;
          &lt;li&gt;Social Profiles&lt;/li&gt;
          &lt;li&gt;Personal Details&lt;/li&gt;
      &lt;/ul&gt;
      &lt;!-- fieldsets --&gt;
      &lt;fieldset class="first block1"&gt;
          &lt;h2 class="fs-title"&gt;Create your account&lt;/h2&gt;
          &lt;h3 class="fs-subtitle"&gt;This is step 1&lt;/h3&gt;
          &lt;input type="text" name="email" placeholder="Email" required data-parsley-group="block1" /&gt;
          &lt;input type="password" name="pass" placeholder="Password" required data-parsley-group="block1" /&gt;
          &lt;input type="password" name="cpass" placeholder="Confirm Password" required data-parsley-group="block1" /&gt;
          &lt;input type="button" name="next" class="next action-button" value="Next" data-current-block="1" data-next-block="2"  /&gt;
      &lt;/fieldset&gt;
      &lt;fieldset class="second block2"&gt;
          &lt;h2 class="fs-title"&gt;Social Profiles&lt;/h2&gt;
          &lt;h3 class="fs-subtitle"&gt;Your presence on the social network&lt;/h3&gt;
          ...
  &lt;input type="button" name="previous" class="previous action-button" value="Previous" data-current-block="2" data-next-block="1" /&gt;
          &lt;input type="button" name="next" class="next action-button" value="Next" data-current-block="2" data-next-block="3" /&gt;
      &lt;/fieldset&gt;
      &lt;fieldset class="third block3"&gt;
          &lt;h2 class="fs-title"&gt;Personal Details&lt;/h2&gt;
          &lt;h3 class="fs-subtitle"&gt;We will never sell it&lt;/h3&gt;
          ...
  &lt;input type="button" name="previous" class="previous action-button" value="Previous" data-current-block="3" data-next-block="2" /&gt;
          &lt;button type="submit" name="donateNow" id="donateNow" class="submit action-button" value="Submit" &gt;Submit&lt;/button&gt;
      &lt;/fieldset&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p><a href="http://jsfiddle.net/zz4f4w8r/" rel="nofollow">Here</a> is a fiddle with my current code with the tweaks to work with parsley.js. (I'm currently running into problem #2)</p>
  
  <p>I cannot for the life of me figure out how to get the validation to work on the page change. Thanks for any help that can be provided!</p>