Показать другое поле на основе ответа

Question

У меня есть форму на моей странице с указанием сведений о сотрудниках.

У меня есть поле выбора для status с ответами Full Time и Part Time

Если пользователь выбирает Part Time Я хотел бы еще одно поле, чтобы появиться, который спрашивает Days per week

Вот мой статус вопрос

<select class="cs-select cs-skin-slide" name="status" data-init-plugin="cs-select"> 
<option value='FT'>Full Time </option> 
<option value='PT'>Part Time </option> 
</select> 

ОБНОВЛЕНИЕ

<script> 
$('#myselectbox').change(function(){ 
     var val = $('#myselectbox').val(); 
     if(val == FT){ 
      $('#forparttime').show(); 
     }else{ 
      $('#forfulltimetime').show(); 

     } 

    }); 
      </script> 

           <div class="form-group"> 
         <label>Employment Type</label> 
         <span class="help"></span><br> 
         <select id="myselectbox" class="cs-select cs-skin-slide" name="status" data-init-plugin="cs-select"> 
    <option value='FT'>Full Time </option> 
    <option value='PT'>Part Time </option> 
    </select> 
    <input type="text" id="forparttime" name="forparttime" style="display:none" > 
    <input type="text" id="forfulltimetime" name="forfulltimetime" style="display:none" > 

</div> 

Answer 1

**<script src="//code.jquery.com/jquery-1.11.3.min.js"></script> 
<script> 
$(document).ready(function(){ 
$('#myselectbox').change(function(){ 
     var val = $('#myselectbox').val(); 
     if(val == 'FT'){ 
     $('#forparttime').hide(); 
     $('#forfulltimetime').show(); 
    }else{ 
     $('#forfulltimetime').hide(); 
     $('#forparttime').show(); 
     } 
    }); 

    }); 
     </script> 
    <div class="form-group"> 
        <label>Employment Type</label> 
        <span class="help"></span><br> 
        <select id="myselectbox" class="cs-select cs-skin-slide" name="status" data-init-plugin="cs-select"> 
<option value='FT'>Full Time </option> 
<option value='PT'>Part Time </option> 
</select> 
<input type="text" id="forparttime" placeholder="forparttime" name="forparttime" style="display:none" > 
<input type="text" id="forfulltimetime" placeholder="forfulltimetime" name="forfulltimetime" style="display:none" > 
</div>** 

Answer 2

Если есть только два варианта статуса, сначала я хотел бы предложить вам использовать логическое значение. А также подумайте об использовании идентификатора для выбора, затем отобразите или спрячьте поле, используя это значение с помощью jquery. что-то вроде

if ($('.cs-select').val()){ $('#ur_field').hide() }

или

if ($('#select_box_id').val()){ $('#ur_field').hide() }

Answer 3

Попробуйте это:

HTML:

<select class="cs-select cs-skin-slide" name="status" data-init-plugin="cs-select"> 
    <option value='FT'>Full Time </option> 
    <option value='PT'>Part Time </option> 
</select> 

<input type="text" id="forparttime" name="forparttime" style="display:none" > 
<input type="text" id="forfulltimetime" name="forfulltimetime" style="display:none" > 

JS:

$(".cs-select").change(function(){ 

    var value = this.value; 

    if (value == "FT"){ 
     $(".your-field-shown").show(); 
     $(".your-field-hidden").hide(); 
    } 

    elseif (value == "PT"){ 
     $(".your-field-shown").hide(); 
     $(".your-field-hidden").show(); 
    } 
});