EasyUI easyui-combobox实现数据联动
实现效果:当用户选择了调查地区以后,只显示当前选择地区的频道,如果没有选择地区,那么频道下拉列表是空的。实现效果,如下
一、定义easyui-combobox控件
<table>
<tr>
<th class="style1">
调查地区:
</th>
<td>
<input id="cmbNetWork" class="easyui-combobox" name="dept" data-options="editable:false" />
</td>
<th class="style1">
频道:
</th>
<td>
<input id="cmbFmName" class="easyui-combobox" name="cmbFmName" data-options="editable:false" />
</td>
</tr>
</table>
二、javascript操作easyui-combobox的语法,绑定地区数据源,当选择地区以后触发loadCmbFM()方法,绑定频道数据源。
$(document).ready(function () { //加载地区信息 var cbotemplte = $("#cmbNetWork"); cbotemplte.combobox({ url: "AjaxHandler/RadioCommon.ashx?action=bindNetwork",//对应提供数据源的ashx页面 valueField: 'CNETWORKID',//绑定字段ID textField: 'CNETWORKNAME',//绑定字段Name onSelect: function (row) { loadCmbFM(row.CNETWORKID);//执行选择操作后执行,row.CNETWORKID是当前选中行的地区ID } }); function loadCmbFM(networkID) {//根据地区ID绑定频道信息 $("#cmbFmName").combobox({ url: "AjaxHandler/RadioCommon.ashx?action=fmByNetworkID&networkID=" + networkID, valueField: 'CFM_ID', textField: 'CFM_CNAME' }); } }) </script>

浙公网安备 33010602011771号