添加第三步到我的嚮導步驟Jquery代碼

Question

我在我的MVC3項目中使用嚮導步驟，現在是兩步，但我想要添加第三步到它。

但是，我仍然希望在第二步中提交表單。 這是我的嚮導一步jQuery代碼的樣子：

$(function() { 

     $(".wizard-step:first").fadeIn(); // show first step 


     // attach backStep button handler 
     // hide on first step 
     $("#back-step").hide().click(function() { 
      var $step = $(".wizard-step:visible"); // get current step 
      if ($step.prev().hasClass("wizard-step")) { // is there any previous step? 
       $step.hide().prev().fadeIn(4500); // show it and hide current step 

       // disable backstep button? 
       if (!$step.prev().prev().hasClass("wizard-step")) { 
        $("#back-step").hide(); 
       } 
      } 
     }); 


     // attach nextStep button handler  
     $("#next-step").click(function() { 

      var $step = $(".wizard-step:visible"); // get current step 
      var validator = $("form").validate(); // obtain validator 
      var anyError = false; 
      $step.find("select").each(function() { 
       if (!this.disabled && !validator.element(this)) { // validate every input element inside this step 
        anyError = true; 
       } 


      }); 
      $step.find("input").each(function() { 
       if (!validator.element(this)) { // validate every input element inside this step 
        anyError = true; 
       } 


      }); 

      if (anyError) 
       return false; // exit if any error found 




      if ($step.next().hasClass("confirm")) { // is it confirmation? 
       // show confirmation asynchronously 
       $.post("/wizard/confirm", $("form").serialize(), function (r) { 
        // inject response in confirmation step 
        $(".wizard-step.confirm").html(r); 
       }); 

      } 

      if ($step.next().hasClass("wizard-step")) { // is there any next step? 
       $step.hide().next().fadeIn(4500); // show it and hide current step 
       $("#back-step").show(); // recall to show backStep button 
      } 

      else { // this is last step, submit form 
       $("form").submit(); 
       } 

       return false; 

      } 


     }); 

    }); 

任何解決方案的高度讚賞。

Answer 1

使用一個索引變量，然後在第2步提交表單，並張貼結果在第三步

例如...我張貼一些這裏參考我的項目的代碼......

if (indexer < 2 && $step.next().hasClass("wizard-step")) { 
     $step.hide().next().fadeIn(); 
     indexer++; 
     ShowStep(); 
    } 
    else { 
     $.post(paths + "/Auction/Post", $('form').serialize(), function (data) { 
      alert(data); 
     }) 
     .complete(function() { 
     }); 
    }