下拉框级联选择功能非常的实用，框架用户管理编辑界面对组织机构的选择在3.2版本中新增了级联选择的支持，让组织机构的选择更加的方便与高效，也不容易出错。
我们框架的组织机构结合实际分成了5种类型，分别为：公司、分公司、部门、子部门、工作组。不同的企业可以根据实际需要进行取舍。用户编辑界面的组织机构选择控件使用了EasyUI的combobox控件，级联的选择主要使用了此控件的onChange事件。
级联选择效果如下图所示：
下面给出增加用户JS部分的代码参考。
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
|
AddUser: function () { //添加用户
var addDialog = top.$.hDialog({
href: formUrl,
title: '添加用户',
width: 610,
height: 640,
iconCls: 'icon16_user_add',
onLoad: function () {
UserAdminMethod.initData();
BindOrganize();
top.$('#Enabled').attr("checked", true);
top.$('#Description').val("");
top.$('#UserName').focus();
},
submit: function () {
if (top.$('#uiform').validate().form()) {
var postData = pageMethod.serializeJson(top.$('#uiform'));
postData.CompanyName = top.$('#CompanyId').combobox('getText');
postData.SubCompanyName = top.$('#SubCompanyId').combobox('getText');
postData.DepartmentName = top.$('#DepartmentId').combobox('getText');
postData.SubDepartmentName = top.$('#SubDepartmentId').combobox('getText');
postData.WorkgroupName = top.$('#WorkgroupId').combobox('getText');
$.ajaxjson("/FrameworkModules/UserAdmin/SubmitForm", postData, function (d) {
if (d.Success) {
msg.ok(d.Message);
addDialog.dialog('close');
mygrid.reload();
} else {
MessageOrRedirect(d);
}
});
} else {
msg.warning('请输入用户名称。');
top.$('#UserName').focus();
}
}
});
return false;
}
|
级联绑定代码参考：
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
|
//绑定组织机构信息-实现级联选择function BindOrganize() {
top.$('#SubCompanyId,#DepartmentId,#SubDepartmentId,#WorkgroupId').combobox({
valueField: 'Id', textField: 'FullName', panelHeight: 100, editable: true
});
top.$('#CompanyId').combobox({
valueField: 'ID', textField: 'FULLNAME', panelHeight: 100, editable: true,
url: '/FrameworkModules/OrganizeAdmin/GetOrganizeByCategory?organizeCategory=Company',
onChange: function (newValue, oldValue) {
top.$('#SubCompanyId').combobox({
url: '/FrameworkModules/OrganizeAdmin/GetCategoryChildrensById?organizeCategory=SubCompany&organzieId=' + newValue,
onChange: function(newValue, oldValue) {
top.$('#DepartmentId').combobox({
url: '/FrameworkModules/OrganizeAdmin/GetCategoryChildrensById?organizeCategory=Department&organzieId=' + newValue
});
top.$('#DepartmentId').combobox({
url: '/FrameworkModules/OrganizeAdmin/GetCategoryChildrensById?organizeCategory=Department&organzieId=' + newValue
});
top.$('#SubDepartmentId').combobox({
url: '/FrameworkModules/OrganizeAdmin/GetCategoryChildrensById?organizeCategory=SubDepartment&organzieId=' + newValue
});
top.$('#WorkgroupId').combobox({
url: '/FrameworkModules/OrganizeAdmin/GetCategoryChildrensById?organizeCategory=WorkGroup&organzieId=' + newValue
});
}
});
}
});
} |
本文转自yonghu86博客园博客，原文链接：http://www.cnblogs.com/huyong/p/7651658.html，如需转载请自行联系原作者