在我的 Laravel 应用程序中,我有一个表单。
在那个表单中,我有一个单选按钮选择字段和两个具有相同 NAME 属性的下拉字段。
应根据单选按钮的选择显示下拉列表。
这是我目前的代码,
<div class="col-xs-12 col-sm-12 col-md-12">
<div class="form-group">
<strong>Sample Collected :</strong>
<label for="chkOffice">
{!! Form ::radio('scb','M',array('class' => 'form-control txt_txt','id'=>'chkOffice','onclick'=>'ShowHideDiv()')) !!}
By Office
</label>
<label for="chkClient">
{!! Form ::radio('scb','F','id'=>'chkClient','onclick'=>'ShowHideDiv2()')) !!}
By Client
</label>
{!! $errors->first('scb','<span class="help-block" role="alert">:message</span>') !!}
{{ Form::select('samp_collected',array_merge(['' => 'Please select a Employee'],$empId),Request::old('samp_collected'),array('class' => 'form-control txt_txtSelect','id'=>'dvtext')) }}
{{ Form::select('samp_collected',array_merge(['' => 'Please select a Client'],$clientId),'id'=>'dvtext2')) }}
{!! $errors->first('samp_collected','<span class="help-block" role="alert">:message</span>') !!}
</div>
</div>
这是我的 JavaScript
<script type="text/javascript">
function ShowHideDiv() {
var chkOffice = document.getElementById("chkOffice");
var dvtext = document.getElementById("dvtext");
alert('office');
dvtext.style.display = chkOffice.checked ? "block" : "none";
dvtext2.style.display = chkOffice.checked ? "none" : "none";
}
function ShowHideDiv2() {
var chkClient = document.getElementById("chkClient");
var dvtext2 = document.getElementById("dvtext");
alert('client');
dvtext2.style.display = chkClient.checked ? "block" : "none";
dvtext.style.display = chkClient.checked ? "none" : "none";
}
</script>
我的 css 是这样的
<style type="text/css">
#dvtext,#dvtext2{
display: none;
}
</style>
但这不起作用,控制台中也没有错误...
我只需要根据单选按钮选择显示正确的下拉字段...