EasyUI入门1 实现下拉框二级联动

无废话直接上代码

var cbRegisterDisciplineId = $('#cbRegisterDiscipline').combobox({
                contentType: "application/x-www-form-urlencoded; charset=UTF-8",
                url: "../../Controller/PurchasePackage/PurchasePackage.ashx?Action=AutoDiscipline",
                editable: false,
                valueField: '专业名称',
                textField: '专业名称',
                onSelect: function (record) {
                    //刷新数据，重新读取专业下的采购包，并清空当前输入的值  
                    cbRegisterPackageId.combobox({
                        disabled: false,
                        contentType: "application/x-www-form-urlencoded; charset=UTF-8",
                        url: "../../Controller/InquiryManage/InquiryRegister.ashx?Action=AutoPackage&DisciplineName=" + encodeURIComponent(record.专业名称),
                        type: "get",
                        dataType: "json",
                        //data: {
                        //    "DisciplineName": encodeURIComponent(record.专业名称)
                        //},   //中文须编码，用encodeURIComponent
                        valueField: 'KSGUID',
                        textField: 'PINFO'
                    }).combobox('clear');;
                }
            });
            var cbRegisterPackageId = $('#cbRegisterPackage').combobox({
                disabled: true,
                contentType: "application/x-www-form-urlencoded; charset=UTF-8",
                url: "../../Controller/InquiryManage/InquiryRegister.ashx?Action=AutoPackage&DisciplineName=" + encodeURIComponent("-全部专业-"),
                type: "get",
                dataType: "json",
                valueField: 'KSGUID',
                textField: 'PINFO'
            });

说明

cbRegisterDiscipline是第一级下拉框，选择专业
cbRegisterPackage是第二级下拉框，选择专业下所属的采购包

传参数失败问题的解决

我想增加一个查询条件，第二级下拉框根据第一级所选择的专业进行查询，但是不知道为什么采用

data: {
    "DisciplineName": encodeURIComponent(record.专业名称)
},   //中文须编码，用encodeURIComponent

的方式传值给ashx失败，提示context.Request[“DisciplineName”]是null。最后改为url方式传值，在ashx采用

string CurrentStr = context.Request.Url.Query;
System.Collections.Specialized.NameValueCollection nv = System.Web.HttpUtility.ParseQueryString(CurrentStr, System.Text.Encoding.GetEncoding("utf-8"));
string DisciplineName = nv["DisciplineName"];       //对接收的字符串进行URL解码;

的方式拿到DisciplineName的值。

代码片段二的作用

var cbRegisterPackageId = $('#cbRegisterPackage').combobox({
                disabled: true,
                contentType: "application/x-www-form-urlencoded; charset=UTF-8",
                url: "../../Controller/InquiryManage/InquiryRegister.ashx?Action=AutoPackage&DisciplineName=" + encodeURIComponent("-全部专业-"),
                type: "get",
                dataType: "json",
                valueField: 'KSGUID',
                textField: 'PINFO'
            });

其实这段代码（以下简称代码片段二）是可以不要的，只要记得把cbRegisterPackageId换成$(‘#cbRegisterPackage’)就可以了。那这段代码有和没有到底有什么区别呢？

要想看到区别，首先要把片段二里的代码

disabled: true,

true 改为 false

这样在页面初始化的时候，combo1和combo2都处于可用状态，此时你就可以看到当片段二执行的时候combo2初始化时会请求后台数据，绑定全部专业的采购包，当片段二没有的时候，combo2初始化为空；当disabled: true是，combo2是不可用的，所以也看不出区别。