使用Codeigniter選擇單選按鈕時如何生成表格

Question

大家好，我想問一下如何使用復選框或單選按鈕選擇選項時生成表單。 當我選擇選項按鈕（經理）時，該表格將出現；如果我選擇選項（管理員），則該表格將不會出現。 有人可以用javascript提供示例代碼，還是可以共享鏈接，以便我參考。 例如我想做的是，我有一個用戶需要填寫的表格

---

1. 全名
2. 地址
3. 用戶類型（單選按鈕）
   • 管理
   • 經理

當用戶選擇作為經理時，表格將自動出現並要求填寫更多表格，例如

---

4. 位置存儲
5. 你有多少員工
6. 店鋪名稱

---

謝謝。

Answer 1

嘗試這個

  $("#usertype").hide(); $('#chkuser').change(function () { repeatCheck('chkuser'); }); function repeatCheck(valCheck) { if ($('#' + valCheck).is(':checked') === true) { $("#usertype").show(); } else { $("#usertype").hide(); } ; } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> Usertype<input type="checkbox" name="chkuser" id="chkuser"> <div id="usertype" class="form-group" > <div class="col-md-9"> <input type="checkbox">manager</input> <input type="checkbox" >admin</input> </div> </div> 

Answer 2

將jQuery加載到頭文件中

<script src="<?php echo base_url().'assets/js/jqueryui-1.10.3.min.js' ?>" type="text/javascript"></script>

形成

 <div class="form-group" id="input_fields">
    <label for="user_type" class="col-sm-3 control-label">User Type</label>
    <div class="col-sm-6">
    <select id="test" name="user_type"  class="form-control">
    <option value="partner">Administrator</option>
    <option value="referral">Referral</option><option 
    <option value="Admin">User</option>
    </select>
    </div>
</div>

jQuery函數

<script type="text/javascript">
    $(document).ready(function() {
     $("#test").change( function(){
     if($("#test").val() == "referral" )
    {
    $("#input_fields").append('<div class="form-group" id = "toggle"><div  class="form-group">'+
    '<label for="percentage" class="col-sm-3 control-label">Percentage</label>'+
    '<div class="col-sm-6">'+
    '<input type="text" name="percentage" id="percentage" class="form-control" placeholder=" Referral commission ">'+
    '<span class="text-danger"><?php echo form_error('percentage'); ?></span>'+
    '</div>'+
    '<div class="col-sm-3"><p class="help-block">Percentage in %</p></div>'+
    '</div>'+
    '<div class="form-group" id = "toggle" >'+
    '<label for="bank_name" class="col-sm-3 control-label">Bank Name</label>'+
    '<div class="col-sm-6">'+
    '<select  name="user_type"  class="form-control">'+
    '<option value="Malayan Banking Berhad">Malayan Banking Berhad</option>'+
    '<option value="CIMB Bank Berhad">CIMB Bank Berhad</option>'+
    '<option value="Public Bank Berhad">Public Bank Berhad</option>'+
    '<option value="RHB Bank Berhad">RHB Bank Berhad</option>'+
    '<option value="Hong Leong Bank Berhad">Hong Leong Bank Berhad</option>'+
    '<option value="AmBank (M) Berhad">AmBank (M) Berhad</option>'+
    '<option value="Alliance Bank Malaysia Berhad">Alliance Bank Malaysia Berhad</option>'+
    '<option value="Bank Rakyat">Bank Rakyat</option>'+
    '<option value="OCBC Bank (Malaysia)">OCBC Bank (Malaysia)</option>'+
    '<option value="HSBC Bank Malaysia">HSBC Bank Malaysia</option>'+

    '</select>'+

    '</div>'+

    '</div>'+
    '<div class="form-group" id = "toggle" >'+
    '<label for="bank_acc_info" class="col-sm-3 control-label">Bank Account Information</label>'+
    '<div class="col-sm-6">'+
    '<input type="text" name="bank_acc_info" id="bank_acc_info" class="form-control" placeholder="Bank Account Information">'+
                                                        '<span class="text-danger"><?php echo form_error('bank_acc_info'); ?></span>'+
    '</div>'+
    '<div class="col-sm-3"><p class="help-block">Bank Number</p></div>'+
    '</div></div>');
    }
    else
    {
    $("#toggle").remove();
    }
     });
    });

在這里，我發現並進行了測試，一切順利。