Jquery 단계 : 선택에 따라 새 탭 추가

Question

jquery 단계를 사용하여 mysite에서 사용자의 양식 데이터를 수집하고 있지만 사용자 선택 결과에 새 탭을 추가하는 방법을 파악하는 데 어려움이 있습니다.

형태 : 내가 추가 탭을하고 싶은

{{ Form::open(array('url' => 'jobs/save', 'class' => 'form-horizontal', 'id' => 'wizard', 'method' => 'PUT', 'file' => true)) }} 

    <h3>Project Overview</h3> 
     <fieldset> 
        <div class="bdb"> 
         <p class="text-center bdb">Basic Info</p> 
         <input class="span5" type="text" name="title" placeholder="Project Title"><br/> 
         <select name="workType" id="workType" placeholder="What type of project Is it?"> 
          <option value="0">What Type of Project is this?</option> 
          <option value="1">New Construction</option> 
          <option value="2">Remodel</option> 
          <option value="3">Professional Services</option> 
          <option value="4">Repair and Maintenance</option> 
          <option value="5">Handyman</option> 
         </select> 
         <br/><br/> 
         <input type="text" name="budget" id="budget" placeholder="What is your budget?"><br/> 
        </div> 


      </fieldset> 

은 선택 입력 값에 따라 나타납니다. 내가 보았을 때까지 본문에서이 일을하려고 시도했다. this answer. 이제 나는 혼란스럽고 나는 해결책에서 멀어지고 있다고 생각한다. 아마 당신은 말할 수

<script> $("#wizard").steps({ 
      headerTag: "h3", 
      bodyTag: "fieldset", 
      onFinished: function (event, currentIndex) 
      { 
       var form = $(this); 
       form.submit(); 

      } 

     }); 

$(function() 
{ 
    var wizard = $("#wizard").steps({ 
     onStepChanging: function(event, currentIndex, newIndex) 
     { 
      if (currentIndex === 0) 
      { 
       if ($("#workType > option:selected").val() === "1") 
       { 
        wizard.steps("insert", 1, { 
         title: "Result 2", 
         contentMode: "html", 
         content: "<p>test</p>" 
        }); 
       } 
      } 
      return true; 
     } 
    }); 
}); 

, 나는 많은 JQuery와 경험이없는 :

여기 내 스크립트입니다. 귀하의 도움에 미리 감사드립니다.

편집 : 마법사가 올바르게 형식이 지정되었지만 현재 새 탭을 추가하거나 "다음"을 클릭하여 진행 중이라고 추가해야합니다.

<script> $("#wizard").steps({ 
      headerTag: "h3", 
      bodyTag: "fieldset", 
      transitionEffect: "slideLeft", 
      onStepChanging: function(event, currentIndex, newIndex) 
      { 
       //only apply to first step 
        if (currentIndex === 0 && ($("#workType > option:selected").val()) === "1") 
        { 
          $("#wizard").steps("insert", 1, { 
          title: "Step Title", 
          content: "<p>Step Body</p>" 
          }); 
        } 
      return true; 

      }, 
      onFinished: function (event, currentIndex) 
      { 
       var form = $(this); 
       form.submit(); 

      }, 



     }); 

:

Answer 1

나는이 작업을 얻었다