NET快速信息化系统开发框架 V3.2 -> Web 用户管理模块编辑界面-组织机构选择支持级联选择

简介:

下拉框级联选择功能非常的实用,框架用户管理编辑界面对组织机构的选择在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,如需转载请自行联系原作者

相关文章
|
监控 安全 JavaScript
【web渗透思路】框架敏感信息泄露(特点、目录、配置)
【web渗透思路】框架敏感信息泄露(特点、目录、配置)
498 0
【web渗透思路】框架敏感信息泄露(特点、目录、配置)
|
1月前
|
安全 测试技术 网络安全
Web安全基础入门+信息收集篇
学习信息收集,针对域名信息,解析信息,网站信息,服务器信息等;学习端口扫描,针对端口进行服务探针,理解服务及端口对应关系;学习WEB扫描,主要针对敏感文件,安全漏洞,子域名信息等;学习信息收集方法及实现安全测试,能独立理解WEB架构框架,树立渗透测试开展思路!
18 0
Web安全基础入门+信息收集篇
|
1月前
|
安全 应用服务中间件 nginx
|
9月前
|
移动开发 JavaScript 定位技术
百度地图开发:地图调起API(Web端)使用终点经纬度直接调用百度地图导航信息的解决方案
百度地图开发:地图调起API(Web端)使用终点经纬度直接调用百度地图导航信息的解决方案
222 0
|
6月前
|
开发框架 .NET 数据库
asp.net企业费用报销管理信息系统VS开发sqlserver数据库web结构c#编程Microsoft Visual Studio
asp.net 企业费用报销管理信息系统是一套完善的web设计管理系统,系统具有完整的源代码和数据库,系统主要采用B/S模式开发。开发环境为vs2010,数据库为sqlserver2008,使 用c#语言开发 应用技术:asp.net c#+sqlserver 开发工具:vs2010 +sqlserver
49 0
|
6月前
|
SQL 数据可视化 API
【Web3 教程】如何通过简单的 API 完成 zkSync 链的交易信息可视化
最近有很多社区朋友在玩可视化数据面板,用到了 Chainbase 的数据 API 和 Flipside 的 LiveQuery,于是我们写了一系列教程,希望能帮大家梳理做仪表盘时的思路,以及获取目标数据的 SQL。 这次举例用的是 zkSync 的数据,抛砖引玉,欢迎大家一起玩玩看~
87 2
|
8月前
|
JavaScript IDE 前端开发
【Web3探索】如何快速获得 NFT 的所有者信息
如果您有兴趣购买或出售某个特定所有者的NFT,本文将向您介绍如何使用Chainbase API获取所有者的地址。通过获得这些信息,您可以直接与所有者联系或通过市场平台进行交易。
89 1
【Web3探索】如何快速获得 NFT 的所有者信息
|
8月前
|
移动开发 UED HTML5
Web内容可编辑性和富文本编辑器
Web内容可编辑性和富文本编辑器
173 0
|
10月前
|
XML 数据格式
web.xml中的web-app中配置信息顺序出错解决办法
web.xml中的web-app中配置信息顺序出错解决办法
94 0
|
10月前
|
监控 安全 测试技术
用 Python 撸一个 Web 服务器-第7章:重构——更好的组织代码
用 Python 撸一个 Web 服务器-第7章:重构——更好的组织代码