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>

 

转载于:https://www.cnblogs.com/zhangjd/p/5810192.html