title: how can i add jQuery Step Form previous button
body: <p>Hello mates this is step form i need to add previous button on second step kindly visit this link
  <a href="http://investmentconnector.com" rel="nofollow noreferrer">http://investmentconnector.com</a><a href="https://i.stack.imgur.com/r93NV.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/r93NV.jpg" alt="enter image description here" /></a></p>
  <p>HTML</p>
  <pre><code>       &lt;form class=&quot;quiz_form&quot; method=&quot;POST&quot; action=&quot;action.php&quot; id=&quot;dealform&quot; data-parsley-validate=&quot;&quot; novalidate=&quot;&quot;&gt;
              &lt;!-- tab 1 --&gt;
              &lt;div class=&quot;tab text-center &quot; style=&quot;display: block;&quot;&gt;
                &lt;div class=&quot;mt-4 text-center form-group&quot;&gt;
                  &lt;label class=&quot;d-flex justify-content-center form_had&quot;&gt;
                    Get Exclusive Investment&lt;br&gt;
  Opportunities in 30 Seconds
                  &lt;/label&gt;
                    &lt;p class=&quot;had_par&quot;&gt;What’s your Investment Goal?&lt;/p&gt;
                  &lt;div class=&quot;row w-100 m-0 justify-content-around&quot;&gt;
                    &lt;div class=&quot;col-md-6&quot;&gt;
                        &lt;div class=&quot;my-2 w-100&quot;&gt;
                          &lt;label for=&quot;what-bring&quot; class=&quot;mx-md-4 radio-btn d-flex align-items-center justify-content-center&quot;&gt;
                            &lt;h5 class=&quot;m-0&quot;&gt;Income Investment&lt;/h5&gt;
                          &lt;/label&gt;
                          &lt;input id=&quot;what-bring&quot; name=&quot;what-bring&quot; class=&quot;what-bring opacity-0 px-2 mx-auto rounded text-secondary form-control text-center d-none&quot; data-parsley-required=&quot;true&quot; data-parsley-group=&quot;block-0&quot; type=&quot;radio&quot; value=&quot;Income investment&quot; required=&quot;&quot; data-parsley-multiple=&quot;what-bring&quot;&gt;
                        &lt;/div&gt;   
                    &lt;/div&gt;
                    &lt;div class=&quot;col-md-6&quot;&gt;
                      &lt;div class=&quot;my-2 w-100&quot;&gt;
                        &lt;label for=&quot;what-bring-growth&quot; class=&quot;mx-md-4 radio-btn d-flex align-items-center justify-content-center&quot;&gt;
                          &lt;h5 class=&quot;m-0&quot;&gt;Capital Growth&lt;/h5&gt;
                        &lt;/label&gt;
                        &lt;input id=&quot;what-bring-growth&quot; name=&quot;what-bring&quot; class=&quot;what-bring opacity-0 px-2 mx-auto rounded text-secondary form-control text-center d-none&quot; data-parsley-required=&quot;true&quot; data-parsley-group=&quot;block-0&quot; type=&quot;radio&quot; value=&quot;Capital Growth&quot; required=&quot;&quot; data-parsley-multiple=&quot;what-bring&quot;&gt;
                      &lt;/div&gt;
                    &lt;/div&gt;
                  &lt;/div&gt;
                  &lt;div class=&quot;row w-100 m-0 justify-content-around&quot;&gt;
                    &lt;div class=&quot;col-md-6&quot;&gt;
                      &lt;div class=&quot;my-2 w-100&quot;&gt;
                        &lt;label for=&quot;what-bring-both&quot; class=&quot;mx-md-4 radio-btn d-flex align-items-center justify-content-center&quot;&gt;
                          &lt;h5 class=&quot;m-0&quot;&gt;Both&lt;/h5&gt;
                        &lt;/label&gt;
                        &lt;input id=&quot;what-bring-both&quot; name=&quot;what-bring&quot; class=&quot;what-bring opacity-0 px-2 m-w mx-auto rounded text-secondary form-control text-center d-none&quot; data-parsley-required=&quot;true&quot; data-parsley-group=&quot;block-0&quot; type=&quot;radio&quot; value=&quot;Both&quot; required=&quot;&quot; data-parsley-multiple=&quot;what-bring&quot;&gt;
                      &lt;/div&gt;   
                    &lt;/div&gt;
                    &lt;div class=&quot;col-md-6&quot;&gt;
                      &lt;div class=&quot;my-2 w-100&quot;&gt;
                        &lt;label for=&quot;what-bring-not&quot; class=&quot;mx-md-4 radio-btn d-flex align-items-center justify-content-center&quot;&gt;
                          &lt;h5 class=&quot;m-0&quot;&gt;Not Sure&lt;/h5&gt;
                        &lt;/label&gt;
                        &lt;input id=&quot;what-bring-not&quot; name=&quot;what-bring&quot; class=&quot;what-bring opacity-0 px-2 mx-auto rounded text-secondary form-control text-center d-none&quot; data-parsley-required=&quot;true&quot; data-parsley-group=&quot;block-0&quot; type=&quot;radio&quot; value=&quot;Not Sure&quot; required=&quot;&quot; data-parsley-multiple=&quot;what-bring&quot;&gt;
                      &lt;/div&gt;
                    &lt;/div&gt;
                  &lt;/div&gt;
                &lt;/div&gt;
              &lt;/div&gt;
              &lt;!-- tab 2 --&gt;
             &lt;div class=&quot;tab text-center disp-none&quot;&gt;
                &lt;div class=&quot;mt-4 text-center form-group &quot;&gt;
                            &lt;label class=&quot;d-flex justify-content-center form_had&quot;&gt;
            Do you want to get paid interest &lt;br&gt;Annually or monthly?
                  &lt;/label&gt;
                  &lt;div class=&quot;row w-100 m-0 justify-content-around&quot;&gt;
                    &lt;div class=&quot;col-6 text-md-right&quot;&gt;
                      &lt;label for=&quot;interest-paid-type&quot; class=&quot;mx-md-4 p-2&quot;&gt;
                        &lt;img class=&quot;img-m my-hover&quot; src=&quot;images/img31.png&quot;&gt;
                      &lt;/label&gt;
                      &lt;h4 class=&quot;mx-md-4 px-md-1&quot;&gt;Monthly&lt;/h4&gt;
                      &lt;input id=&quot;interest-paid-type&quot; name=&quot;interest-paid-type&quot; class=&quot;interest-paid-type opacity-0 px-2 mx-auto rounded text-secondary form-control text-center position-absolute&quot; data-parsley-required=&quot;true&quot; data-parsley-group=&quot;block-1&quot; type=&quot;radio&quot; value=&quot;Monthly&quot; required=&quot;&quot; data-parsley-multiple=&quot;interest-paid-type&quot;&gt;
                    &lt;/div&gt;
                    &lt;div class=&quot;col-6 text-md-left&quot;&gt;
                      &lt;label for=&quot;interest-paid-type-yearly&quot; class=&quot;mx-md-4 p-2&quot;&gt;
                        &lt;img class=&quot;img-y my-hover&quot; src=&quot;images/img-365.png&quot;&gt;
                      &lt;/label&gt;
                      &lt;h4 class=&quot;mx-md-4 px-md-2&quot;&gt;Annually&lt;/h4&gt;
                      &lt;input id=&quot;interest-paid-type-yearly&quot; name=&quot;interest-paid-type&quot; class=&quot;interest-paid-type opacity-0 px-2 mx-auto rounded text-secondary form-control text-center position-absolute&quot; data-parsley-required=&quot;true&quot; data-parsley-group=&quot;block-1&quot; type=&quot;radio&quot; value=&quot;Annually&quot; required=&quot;&quot; data-parsley-multiple=&quot;interest-paid-type&quot;&gt;
                    &lt;/div&gt;
                  &lt;/div&gt;
                &lt;/div&gt;
              &lt;/div&gt;
              &lt;!-- tab 3 --&gt;
              &lt;div class=&quot;tab text-center disp-none&quot; style=&quot;&quot;&gt;
                &lt;div class=&quot;text-center form-group&quot; style=&quot;&quot;&gt;
                   &lt;label class=&quot;d-flex justify-content-center form_had&quot;&gt;
                    Get Exclusive Investment &lt;br&gt;
                  Opportunities in 30 Seconds
                  &lt;/label&gt;
                    &lt;p class=&quot;had_par&quot;&gt;How much you would be looking to Invest?&lt;/p&gt; 
                  &lt;div class=&quot;position-relative rangediv d-flex justify-content-center my-3 m-w mx-auto mt-5&quot; style=&quot;&quot;&gt;
                    &lt;input class=&quot;invest-amount&quot; id=&quot;invest-amount&quot; type=&quot;range&quot; min=&quot;1000&quot; max=&quot;100000&quot; step=&quot;1000&quot; value=&quot;50000&quot; name=&quot;invest-amount&quot; data-parsley-group=&quot;block-2&quot; required=&quot;&quot; style=&quot;position: absolute; width: 1px; height: 1px; overflow: hidden; opacity: 0;&quot;&gt;&lt;div class=&quot;rangeslider rangeslider--horizontal&quot; id=&quot;js-rangeslider-0&quot; style=&quot;&quot;&gt;&lt;div class=&quot;rangeslider__fill&quot; style=&quot;width: 329.788px;&quot;&gt;&lt;/div&gt;&lt;div class=&quot;rangeslider__handle&quot; style=&quot;left: 314.788px;&quot;&gt;&lt;div class=&quot;range-output&quot;&gt;£50,000&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;
                  &lt;/div&gt;
                  &lt;div class=&quot;mt-3&quot;&gt;&lt;/div&gt;
                  &lt;button id=&quot;btn-next&quot; type=&quot;button&quot; class=&quot;btn-lg btn-next text-white rounded-lg font-weight-bold w-100 mt-3 hv-50 nextStep&quot; onclick=&quot;nextStep(1)&quot;&gt;
                    Next
                  &lt;/button&gt;
                &lt;/div&gt;
              &lt;/div&gt;
              &lt;!-- tab 4 --&gt;
              &lt;div class=&quot;tab text-center disp-none&quot;&gt;
                &lt;div class=&quot;row w-100 m-0&quot;&gt;
                  &lt;div class=&quot;col-md-6 mt-4 pl-md-0 pr-md-2 px-0 text-center form-group position-relative mb-md-3 mb-0&quot;&gt;
                    &lt;label class=&quot;d-flex justify-content-center text-center font-weight-bold text-black f-25 mb-3 fs-md-21&quot;&gt;
                      What's your first name?
                    &lt;/label&gt;
                    &lt;input placeholder=&quot;First Name&quot; id=&quot;first_name&quot; name=&quot;first_name&quot; class=&quot;first_name px-2 hv-50 mx-auto border border-secondary bg-white rounded text-secondary form-control&quot; data-parsley-required=&quot;true&quot; data-parsley-required-message=&quot;Please Enter First Name&quot; data-parsley-group=&quot;block-3&quot; data-parsley-pattern-message=&quot;First Name Must Be Alphabetic&quot; data-parsley-pattern=&quot;/^[a-zA-Z ]*$/&quot; type=&quot;text&quot; required=&quot;&quot;&gt;
                      &lt;i class=&quot;validate success fa fa-check-circle&quot;&gt;&lt;/i&gt;
                      &lt;i class=&quot;validate error fa fa-times-circle&quot;&gt;&lt;/i&gt;
                  &lt;/div&gt;
                  &lt;div class=&quot;col-md-6 mt-4 pr-md-0 pl-md-2 px-0 text-center form-group position-relative&quot;&gt;
                    &lt;label class=&quot;d-flex justify-content-center text-center font-weight-bold text-black f-25 mb-3 fs-md-21&quot;&gt;
                      What's your last name?
                    &lt;/label&gt;
                    &lt;input placeholder=&quot;Last Name&quot; id=&quot;last_name&quot; name=&quot;last_name&quot; class=&quot;last_name px-2 hv-50 mx-auto border border-secondary bg-white rounded text-secondary form-control&quot; data-parsley-required=&quot;true&quot; data-parsley-required-message=&quot;Please Enter Last Name&quot; data-parsley-group=&quot;block-3&quot; data-parsley-pattern-message=&quot;Last Name Must Be Alphabetic&quot; data-parsley-pattern=&quot;/^[a-zA-Z ]*$/&quot; type=&quot;text&quot; required=&quot;&quot;&gt;
                      &lt;i class=&quot;validate success fa fa-check-circle&quot;&gt;&lt;/i&gt;
                      &lt;i class=&quot;validate error fa fa-times-circle&quot;&gt;&lt;/i&gt;
                  &lt;/div&gt; 
                  &lt;button id=&quot;btn-next&quot; type=&quot;button&quot; class=&quot;btn-lg btn-next text-white rounded-lg font-weight-bold w-100 mt-4 hv-50 nextStep&quot; onclick=&quot;nextStep(1)&quot;&gt;
                    Next
                  &lt;/button&gt;
                &lt;/div&gt;
              &lt;/div&gt;
              &lt;!-- tab 5 --&gt;
              &lt;div class=&quot;tab text-center disp-none&quot;&gt;
                &lt;div class=&quot;row w-100 m-0&quot;&gt;
                  &lt;div class=&quot;col-md-6 mt-4 pl-md-0 pr-md-2 px-0 text-center form-group position-relative mb-md-3 mb-0&quot;&gt; 
                      &lt;label class=&quot;text-start  w-100 mb-1 form-label&quot;&gt;&lt;strong&gt;What's your email address?&lt;/strong&gt;&lt;/label&gt;
                    &lt;input placeholder=&quot;Email&quot; id=&quot;email&quot; name=&quot;email&quot; class=&quot;email px-2 hv-50 mx-auto border border-secondary bg-white rounded text-secondary form-control&quot; data-parsley-required=&quot;true&quot; data-parsley-required-message=&quot;Please Enter Valid Email Address&quot; data-parsley-group=&quot;block-4&quot; data-parsley-type=&quot;email&quot; data-parsley-validemail=&quot;&quot; type=&quot;email&quot; required=&quot;&quot;&gt;
                      &lt;i class=&quot;validate success fa fa-check-circle&quot;&gt;&lt;/i&gt;
                      &lt;i class=&quot;validate error fa fa-times-circle&quot;&gt;&lt;/i&gt;
                  &lt;/div&gt;
                  &lt;div class=&quot;col-md-6 mt-4 pl-md-0 pr-md-2 px-0 text-center form-group position-relative mb-md-3 mb-0&quot;&gt;
                    &lt;label class=&quot;text-start  w-100 mb-1 form-label&quot;&gt;&lt;strong&gt;Phone No&lt;/strong&gt;&lt;/label&gt;
                    &lt;input placeholder=&quot;Phone No&quot; id=&quot;phone&quot; name=&quot;phone&quot; class=&quot;email px-2 hv-50 mx-auto border border-secondary bg-white rounded text-secondary form-control&quot; data-parsley-required=&quot;true&quot; data-parsley-required-message=&quot;Please Enter Valid Email Address&quot; data-parsley-group=&quot;block-4&quot; data-parsley-type=&quot;tel&quot; data-parsley-validemail=&quot;&quot; type=&quot;email&quot; required=&quot;&quot;&gt;
                      &lt;i class=&quot;validate success fa fa-check-circle&quot;&gt;&lt;/i&gt;
                      &lt;i class=&quot;validate error fa fa-times-circle&quot;&gt;&lt;/i&gt;
                  &lt;/div&gt;
                            &lt;div class=&quot;col-md-6 pl-md-0 pr-md-2 px-0 text-center form-group position-relative mb-md-3 mb-0&quot;&gt; 
                            &lt;label class=&quot;text-start  w-100 mb-1 form-label&quot;&gt;&lt;strong&gt;Postal Code&lt;/strong&gt;&lt;/label&gt;
                            &lt;div class=&quot;input-group mb-3&quot;&gt;
                              
       &lt;input type=&quot;text&quot; class=&quot;last_name px-2 hv-50 mx-auto border border-secondary bg-white rounded text-secondary form-control&quot; id=&quot;postalcode&quot; placeholder=&quot;Postal Code&quot;&gt;
    &lt;div class=&quot;input-group-append&quot;&gt;
      &lt;span class=&quot;input-group-text&quot;&gt;&lt;button type=&quot;submit&quot; class=&quot;btn btn-primary&quot;&gt;Find Address&lt;/button&gt;&lt;/span&gt;
    &lt;/div&gt;
  &lt;/div&gt;
                      &lt;i class=&quot;validate success fa fa-check-circle&quot;&gt;&lt;/i&gt;
                      &lt;i class=&quot;validate error fa fa-times-circle&quot;&gt;&lt;/i&gt;
                  &lt;/div&gt;
                  &lt;div class=&quot;col-md-6 pr-md-0 pl-md-2 px-0 text-center form-group position-relative&quot;&gt;
                    
                     &lt;div class=&quot;form-group col-lg-12 property-div display-none&quot; style=&quot;display: block;&quot;&gt;
                          &lt;label class=&quot;text-start  w-100 mb-1 form-label&quot;&gt;&lt;strong&gt;Your Property&lt;/strong&gt;&lt;/label&gt;
                          &lt;input type=&quot;hidden&quot; name=&quot;towncity&quot; class=&quot;towncity&quot; value=&quot;Bradford&quot;&gt;
                          &lt;input type=&quot;hidden&quot; name=&quot;street1&quot; class=&quot;street1&quot; value=&quot;89 Westgate&quot;&gt;
                          &lt;input type=&quot;hidden&quot; name=&quot;county&quot; class=&quot;county&quot; value=&quot;West Yorkshire&quot;&gt;
                          &lt;input type=&quot;hidden&quot; name=&quot;houseNumber&quot; class=&quot;houseNumber&quot; value=&quot;&quot;&gt;
                          &lt;input type=&quot;hidden&quot; name=&quot;street2&quot; class=&quot;street2&quot; value=&quot;&quot;&gt;
                          &lt;input type=&quot;hidden&quot; name=&quot;building&quot; class=&quot;building&quot; value=&quot;89&quot;&gt;
                          &lt;select id=&quot;property&quot; name=&quot;property&quot; class=&quot;last_name px-2 hv-50 mx-auto border border-secondary bg-white rounded text-secondary form-control&quot; data-parsley-required=&quot;true&quot; data-parsley-required-message=&quot;Please Select Your property&quot; data-parsley-group=&quot;block-4&quot; required=&quot;&quot; data-parsley-id=&quot;35&quot;&gt;
                &lt;sption&gt;1&lt;/sption&gt;
                &lt;sption&gt;2&lt;/sption&gt;
                    &lt;/select&gt;
                         
                      
                      
  
                      
                      &lt;i class=&quot;validate success fa fa-check-circle&quot;&gt;&lt;/i&gt;
                      &lt;i class=&quot;validate error fa fa-times-circle&quot;&gt;&lt;/i&gt;
                      &lt;div class=&quot;phoneerror&quot;&gt;&lt;/div&gt;
                  &lt;/div&gt; 
    &lt;/div&gt;
                  &lt;div class=&quot;row align-items-center justify-content-center&quot;&gt;
                    &lt;div class=&quot;checkbox-col col-lg-8 text-center&quot;&gt;
                      &lt;div class=&quot;checkbox-area position-relative&quot;&gt;
                        &lt;div class=&quot;bg-opacity rounded-left border-right&quot;&gt;
                        &lt;/div&gt;
                        &lt;div class=&quot;custom-control custom-checkbox border p-4 rounded shadow&quot;&gt;
                          &lt;input type=&quot;checkbox&quot; name=&quot;customCheckbox&quot; class=&quot;custom-control-input approve customCheckbox&quot; id=&quot;customCheckbox&quot; data-parsley-required=&quot;true&quot; data-parsley-group=&quot;block-5&quot; data-parsley-required-message=&quot;Please accept our terms and conditions&quot; data-parsley-multiple=&quot;customCheckbox&quot;&gt;
                          &lt;label class=&quot;custom-control-label text-blue fw-500 fs-16 pl-md-5 pl-5r&quot; for=&quot;customCheckbox&quot;&gt;Accept Terms &amp;amp; Conditions.&lt;/label&gt;
                        &lt;/div&gt;
                      &lt;/div&gt;
                      &lt;div class=&quot;error-checkbox newcheckbox&quot;&gt;&lt;/div&gt;
                      &lt;div class=&quot;my-3&quot;&gt;
                        &lt;p&gt;By checking this box you confirm that you understand the Investment privacy policy and opt-in that you will be contacted.&lt;/p&gt;
                      &lt;/div&gt;
                    &lt;/div&gt;
                  &lt;/div&gt;
                  &lt;input type=&quot;hidden&quot; name=&quot;lid&quot; id=&quot;clickid&quot; value=&quot;&quot;&gt;
                  &lt;input type=&quot;hidden&quot; name=&quot;aid&quot; id=&quot;aid&quot; value=&quot;&quot;&gt;
                  &lt;input value=&quot;Compare Now!&quot; type=&quot;submit&quot; class=&quot;Compare_now&quot;&gt;
                  
                &lt;/div&gt;
              &lt;/div&gt;
              &lt;!--&lt;div class=&quot;back-btn d-flex justify-content-center align-items-center&quot; onclick=&quot;backStep(-1)&quot;&gt;
                &lt;i class=&quot;fas fa-arrow-left&quot;&gt;&lt;/i&gt;
              &lt;/div&gt;--&gt;
              &lt;div class=&quot;progress mt-2 mb-4&quot;&gt; 
               &lt;div id=&quot;progressBar&quot; class=&quot;progress-bar progress-bar-striped bg-success&quot; role=&quot;progressbar&quot; style=&quot;width: 0%&quot;&gt;&lt;/div&gt;
              &lt;/div&gt;
                
            &lt;/form&gt;
  </code></pre>
  <p>Jquery`    var isEmail =false
  var isPhone =false
  var currentTab = 0; // Current tab is set to be the first tab (0)
  showTab(currentTab); // Display the current tab
  var formValidation = {};
  validate();</p>
  <pre><code>  function numberWithCommas(x) {
      return x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, &quot;,&quot;);
    }
  
    $('input[type=&quot;range&quot;]').rangeslider({
      polyfill : false,
      onInit : function() {
        this.output = $( '&lt;div class=&quot;range-output&quot; /&gt;' ).appendTo( this.$range.find(&quot;.rangeslider__handle&quot;) ).html( &quot;£&quot;+numberWithCommas(this.$element.val()) );
      },
      onSlide : function( position, value ) {
        if (value &gt;= 100000) {
          this.output.html( &quot;£&quot;+numberWithCommas(value)+&quot;+&quot; );
        }else{
          this.output.html( &quot;£&quot;+numberWithCommas(value) );
        }
      }
    });
  
    $( &quot;#btn-submit&quot; ).click(function() {
      if (anOtherValidate() == true) {
        $('#btn-submit').prop('disabled', true);
        postData();
      }
    });
  
    $( &quot;.what-bring&quot; ).change(function() {
      if ($(&quot;input[name='what-bring']:checked&quot;).val() !== &quot;&quot;) {
        nextStep(1);
      }
    });
  
    $( &quot;.interest-paid-type&quot; ).change(function() {
      if ($(&quot;input[name='interest-paid-type']:checked&quot;).val() !== &quot;&quot;) {
        nextStep(1);
      }
    });
  
    window.onload = function onPageLoad() {
      $(&quot;#clickid&quot;).val(getUrlParameter(&quot;lid&quot;)  || &quot;&quot;);
    }
  
    function showTab(n) {
      // This function will display the specified tab of the form ...
      var x = document.getElementsByClassName(&quot;tab&quot;);
      x[n].style.display = &quot;block&quot;;
      fixStepIndicator(n)
    }
  
    function backStep(n){
      if (currentTab &gt; 0) {
        $('.nextStep').prop('disabled', false);
        var x = document.getElementsByClassName(&quot;tab&quot;);
        x[currentTab].style.display = &quot;none&quot;;
        currentTab = currentTab + n;
        showTab(currentTab);
      }
    }
  
    function nextStep(n) {
      $('#dealform').parsley().whenValidate({
        group: 'block-' + currentTab
      }).done(function() {
        var x = document.getElementsByClassName(&quot;tab&quot;);
        x[currentTab].style.display = &quot;none&quot;;
        // Increase or decrease the current tab by 1:
        currentTab = currentTab + n;
        if (currentTab &gt;= x.length) {
          if (anOtherValidate() == true){
            $('.nextStep').prop('disabled', true);
            postData()
          }else{
            $('#dealform').parsley().validate()
          }
          return true
        }
        showTab(currentTab);
      })
    }
  
    function anOtherValidate(){
      var selectedWhatBring = $(&quot;input[name='what-bring']:checked&quot;). val();
      var selectedInterstPaidType = $(&quot;input[name='interest-paid-type']:checked&quot;).val();
  
      if (selectedWhatBring == &quot;&quot;){
        var x = document.getElementsByClassName(&quot;tab&quot;);
        x[0].style.display = &quot;block&quot;;
        x[1].style.display = &quot;none&quot;;
        x[2].style.display = &quot;none&quot;;
        x[3].style.display = &quot;none&quot;;
        x[4].style.display = &quot;none&quot;;
        currentTab = 0
        $('#dealform').parsley().validate()
        return false
      }else if(selectedInterstPaidType == &quot;&quot;){
        var x = document.getElementsByClassName(&quot;tab&quot;);
        x[1].style.display = &quot;block&quot;;
        x[0].style.display = &quot;none&quot;;
        x[2].style.display = &quot;none&quot;;
        x[3].style.display = &quot;none&quot;;
        x[4].style.display = &quot;none&quot;;
        currentTab = 1
        $('#dealform').parsley().validate()
        return false
      }else if($(&quot;input[name='invest-amount']&quot;).val() == &quot;&quot;){
        var x = document.getElementsByClassName(&quot;tab&quot;);
        x[2].style.display = &quot;block&quot;;
        x[0].style.display = &quot;none&quot;;
        x[1].style.display = &quot;none&quot;;
        x[3].style.display = &quot;none&quot;;
        x[4].style.display = &quot;none&quot;;
        currentTab = 2
        $('#dealform').parsley().validate()
        return false
      }else if(document.getElementsByClassName('first_name')[0].value.length &lt; 2
        || document.getElementsByClassName('last_name')[0].value.length &lt; 2){
        var x = document.getElementsByClassName(&quot;tab&quot;);
        x[3].style.display = &quot;block&quot;;
        x[0].style.display = &quot;none&quot;;
        x[1].style.display = &quot;none&quot;;
        x[2].style.display = &quot;none&quot;;
        x[4].style.display = &quot;none&quot;;
        currentTab = 3
        $('#dealform').parsley().validate()
        return false
      }else if(document.getElementsByClassName('email')[0].value.length &lt; 4
        || document.getElementsByClassName('phone')[0].value.length &lt; 10){
        var x = document.getElementsByClassName(&quot;tab&quot;);
        x[4].style.display = &quot;block&quot;;
        x[0].style.display = &quot;none&quot;;
        x[1].style.display = &quot;none&quot;;
        x[2].style.display = &quot;none&quot;;
        x[3].style.display = &quot;none&quot;;
        currentTab = 4
        $('#dealform').parsley().validate()
        return false
      }
      return true
    }
    function validate(){
      formValidation = $('#dealform').parsley({
        trigger: &quot;focusout&quot;,
        errorClass: 'error',
        successClass: 'valid',
        errorsWrapper: '&lt;div class=&quot;parsley-error-list&quot;&gt;&lt;/div&gt;',
        errorTemplate: '&lt;label class=&quot;error&quot;&gt;&lt;/label&gt;',
        errorsContainer (field) {
          if(field.$element.hasClass('approve')){
            return $('.error-checkbox')
          }
          if(field.$element.hasClass('phone')){
            return $('.phoneerror')
          }
          return field.$element.parent()
        },
      })
        validatePhone()
      validateEmail()
    }
  
     function validatePhone(){
        window.Parsley.addValidator('validphone', {
          validateString: function(value){
            var options = {
              DefaultCountryCode: iti.selectedCountryData.dialCode,
              BarredPrefixes: &quot;&quot;,
              AllowedPrefixes: &quot;&quot;,
            };
            var params = {
              number: $(&quot;.phone&quot;).val(),
              options: options
            };
  
           var xhr = $.ajax(&quot;https://webservices.data-8.co.uk/MobileValidation/IsValid.json?key=X479-GTNM-TWEY-W3EB&quot;,
                {
                  method: &quot;POST&quot;,
                  data: JSON.stringify(params)
                });
            return xhr.then(function(json) {
              if (json.Result == &quot;Success&quot;) {
                isPhone = true
                return true
              }else{
                return $.Deferred().reject(&quot;Please Enter Valid Phone Number&quot;);
              }
            })
          },
          messages: {
             en: 'Please Enter Valid Phone Number',
          }
        });
      }
  
    function validateEmail(){
      window.Parsley.addValidator('validemail', {
        validateString: function(value){
          var options = {};
          var params = {
            email: $(&quot;.email&quot;).val(),
            level: &quot;MX&quot;,
            options: options
          };
  
         var xhr = $.ajax(&quot;https://webservices.data-8.co.uk/EmailValidation/IsValid.json?key=X479-GTNM-TWEY-W3EB&quot;,
              {
                method: &quot;POST&quot;,
                data: JSON.stringify(params)
              });
          return xhr.then(function(json) {
            if (json.Result == &quot;Valid&quot;) {
              isEmail = true
              return true
            }else{
              return $.Deferred().reject(&quot;Please Enter Valid Email Address&quot;);
            }
          })
        },
        messages: {
           en: 'Please Enter Valid Email Address',
        }
      });
    }
  
  
    function fixStepIndicator(num) {
      var progress = document.getElementById('progressBar');
      if(num &gt;= 0) {
        progress.style.width = (num*20)+&quot;%&quot;;
        progress.innerText = &quot;Progress &quot; + (num*20) + &quot;%&quot;;
        if( num ==  0){
          progress.innerText = '';
        }
      }
    }
  
    function getData() {
      var e = JSON.parse(localStorage.getItem(&quot;parameters&quot;))
      return {
        firstname: $(&quot;#first_name&quot;).val(),
        lastname: $(&quot;#last_name&quot;).val(),
        email: $(&quot;#email&quot;).val(),
        phone1: $(&quot;#phone&quot;).val(),
        interest_paid_type:$(&quot;input[name='interest-paid-type']:checked&quot;). val(),
        investing_amount: $(&quot;input[name='invest-amount']&quot;).val(),
        what_bring: $(&quot;input[name='what-bring']:checked&quot;). val(),
        timestamp: new Date,
        user_agent: window.navigator.userAgent,
        parameters: e
      };
    }
    function postData() {
      var e = getData();
      e['before_send'] = JSON.stringify(getData());
      console.log(e)
      $.ajax({
        type: &quot;POST&quot;,
        url: &quot;&quot;,
        data: e,
        success: function(e) {
          console.log(e);
          window.location = &quot;thank-you.html&quot;;
        },
        dataType: &quot;json&quot;
      })
    }
  
    function getUrlParameter(sParam) {
      var sPageURL = window.location.search.substring(1),
        sURLVariables = sPageURL.split('&amp;'),
        sParameterName,
        i;
      for (i = 0; i &lt; sURLVariables.length; i++) {
        sParameterName = sURLVariables[i].split('=');
  
        if (sParameterName[0] === sParam) {
          return sParameterName[1] === undefined ? true : decodeURIComponent(sParameterName[1]);
        }
      }
    }
  
    function getFormattedCurrentDate() {
      var date = new Date();
      var day = addZero(date.getDate());
      var monthIndex = addZero(date.getMonth() + 1);
      var year = date.getFullYear();
      var min = addZero(date.getMinutes());
      var hr = addZero(date.getHours());
      var ss = addZero(date.getSeconds());
  
      return day + '/' + monthIndex + '/' + year + ' ' + hr + ':' + min + ':' + ss;
    }
  
    function addZero(i) {
      if (i &lt; 10) {
        i = &quot;0&quot; + i;
      }
      return i;
    }`
  </code></pre>