簡體   English   中英

根據之前的字段答案自動填充下一個選擇框

[英]Auto populate next select box based on previous field answer

如果第一個問題的答案是1>我有2個問題我希望下一個答案自動填充為是。 有人能引導我朝正確的方向走嗎?

<div class="field">
  <!-- Number of Employees -->
  <label>Number of Employees</label>
  <div class="styled-select">
    <select name="NoOfEmployees" class="validate[required]" data-prompt-position="topLeft:110,15">
      <option value="">Please select</option>
      <?php
      foreach (range(0, 49) as $number) {
          echo '<option value="'.$number.'">'.$number.'</option>';
      }
      ?>
      <option value="50 Plus">50+</option>
    </select>
  </div>
</div>

<div class="field">
  <!-- Employers Liability Cover Required -->
  <label>Employers Liability Cover Required</label>
  <div class="styled-select">
    <select name="EmployersLiabilityCover" class="validate[required]" data-prompt-position="topLeft:110,15">
      <option value="">Please select</option>
      <option value="Yes">Yes</option>
      <option value="No">No</option>
    </select>
  </div>
</div>

如果答案是0,那么我只需要下一個問題就可以選擇。

使用jquery onchange,
給selectbox輸入單獨的id,
使用jquery val()獲取selectbox值
使用if條件檢查大於0

代碼如下所示

<div class="field">
    <!-- Number of Employees -->
    <label>Number of Employees</label>
    <div class="styled-select">
        <select name="NoOfEmployees" class="validate[required]" id="select1" data-prompt-position="topLeft:110,15">
            <option value="">Please select</option>
            <?php
            foreach (range(0, 49) as $number) {
                echo '<option value="'.$number.'">'.$number.'</option>';
            }
            ?>
            <option value="50 Plus">50+</option>
        </select>
    </div>
</div>

<div class="field">
    <!-- Employers Liability Cover Required -->
    <label>Employers Liability Cover Required</label>
    <div class="styled-select">
        <select name="EmployersLiabilityCover" id="select2" class="validate[required]" data-prompt-position="topLeft:110,15">
            <option value="">Please select</option>
            <option value="Yes">Yes</option>
            <option value="No">No</option>
        </select>
    </div>
</div>

<script src="https://code.jquery.com/jquery-2.1.4.js"></script>
<script>
    $('#select1').on('change', function() {
        if(this.value>0)
        {
            $("#select2").val("Yes");
        }
        else
        {
            $("#select2").val("");
        }
    });
</script>

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM