大家好我想问如何使用复选框或单选按钮选择选项时生成表单。当我选择选项按钮(经理),并且如果我选择选项(admin),表单将不会出现。有人可以提供JavaScript示例代码或可以共享链接,所以我可以参考。例如我尝试做的是,我有一个表格,这是用户需要填写如何使用codeigniter选择单选按钮时生成表单
- 全名
- 地址
- 用户类型(单选按钮)
- 管理
- 管理员
当用户选择作为经理的形式将自动出现,并要求填写更多格式如
- 位置商店
- ü人员有多少
- 店名
谢谢。
大家好我想问如何使用复选框或单选按钮选择选项时生成表单。当我选择选项按钮(经理),并且如果我选择选项(admin),表单将不会出现。有人可以提供JavaScript示例代码或可以共享链接,所以我可以参考。例如我尝试做的是,我有一个表格,这是用户需要填写如何使用codeigniter选择单选按钮时生成表单
当用户选择作为经理的形式将自动出现,并要求填写更多格式如
谢谢。
尝试此
$("#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>
负载的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();
}
});
});
这里我发现了什么,我测试了一下,一切都走畅。
到目前为止你有尝试过什么吗? – Endless
是的,我尝试做一些研究,我得到的解决方案是使用JavaScript的权利。但我没有得到任何样本,我可以参考和学习。可能是我的搜索关键字是错误的.. –
[使用单选按钮切换元素](https://www.google.se/search?source=hp&q=toggle+element+with+radio+button&oq=toggle+element+with+ radio + button&gs_l = psy-ab.3 ... 792.792.0.1223.0.0.0.0.0.0.0.0..0.0 .... 0 ... 1.1.64.psy-ab..0.0.0.z34OaATLwB4) – Endless