多步表單按鈕禁用，直到表單選擇字段

Question

這是我的形式它是一個多步驟的形式，當我提出一個步驟，然後按鈕啓用，並進入下一步，直到表單字段按鈕已被禁用。我想選擇項目選擇按鈕已禁用。我怎樣才能做到這一點？

<form action="" method="POST" id="ccSelectForm"> 

    <select name="select-item" class="form-control" id="select_field"> 
      <option value="">Select your option</option> 
      <option value="2">2</option> 
      <option value="3">3</option> 
      <option value="4">4</option> 
      <option value="5">5</option> 
     </select> 
    </div> 
    <div class="btn-continue"> 
     <button type="button" id="register2" class="btn btn-default next-step ">Continue</button>  
    </div> 


    <div id="menu2" class="tab-pane fade"> 
     <div class="tab-form-content"> 
      <h2>What are your <b>overall goals?</b></h2> 
      <div class="bor-bottom"></div> 


       <div class="form-group"> 
        <input type="text" class="form-control" name="name" id="" placeholder="Name"> 
       </div> 
       <div class="form-group"> 
        <input type="email" class="form-control" name="email" id="" placeholder="Email"> 
       </div> 
       <div class="form-group"> 
        <input type="text" class="form-control" id="" name="phone_number" placeholder="Phone number"> 
       </div> 

       <div class="btn-continue"> 
        <button type="submit" name="submit" class="btn btn-default next-step register">Submit</button> 

        <br /> 

        <button type="button" id="register3" class="btn go-back prev-step">Go Back</button> 
       </div> 

     </div> 
    </div> 

</form> 



$(document).ready(function() { 
     $("#register2,#register3").prop("disabled", true); 
     $('#ccSelectForm').validate({ 
      rules: { 
       website: { 
        required: true, 
       }, 
       optionsRadios: { 
        required: true, 
       }, 
       budget: { 
        required: true, 
       }, 
       name: { 
        required: true, 
       }, 
       email: { 
        required: true, 
       }, 
       phone_number: { 
        required: true, 
       } 
       /* inputEmailConfirm: { 
        equalTo: '#inputEmail' 
       } */ 
      } 
     }); 

     $('#ccSelectForm input').on('keyup blur', function() { 
      if ($('#ccSelectForm').valid()) { 
       $("#register2,#register3").prop("disabled", false); 
      } else { 
        $("#register2,#register3").prop("disabled", true); 
      } 
     }); 

    });  

Answer 1

開始有殘疾人按鈕

<button type="button" id="register2" class="btn btn-default next-step " disabled="disabled">Continue</button>

將一個函數在您選擇的變化，如果項目選擇啓用按鈕

$(function(){ 
    $('#select_field').change(function(){ 
     var itemVal = $(this).val(); 
     if(itemVal != ''){ 
      $('#register2').removeAttr('disabled'); 
     } 
     else{ 
      $('#register2').attr('disabled', 'disabled'); 
     } 
    }); 
});