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,如需转载请自行联系原作者
相关文章
|
3月前
|
开发框架 搜索推荐 数据可视化
Django框架适合开发哪种类型的Web应用程序?
Django 框架凭借其强大的功能、稳定性和可扩展性,几乎可以适应各种类型的 Web 应用程序开发需求。无论是简单的网站还是复杂的企业级系统,Django 都能提供可靠的支持,帮助开发者快速构建高质量的应用。同时,其活跃的社区和丰富的资源也为开发者在项目实施过程中提供了有力的保障。
157 62
|
3月前
|
开发框架 JavaScript 前端开发
TypeScript 是一种静态类型的编程语言,它扩展了 JavaScript,为 Web 开发带来了强大的类型系统、组件化开发支持、与主流框架的无缝集成、大型项目管理能力和提升开发体验等多方面优势
TypeScript 是一种静态类型的编程语言,它扩展了 JavaScript,为 Web 开发带来了强大的类型系统、组件化开发支持、与主流框架的无缝集成、大型项目管理能力和提升开发体验等多方面优势。通过明确的类型定义,TypeScript 能够在编码阶段发现潜在错误,提高代码质量;支持组件的清晰定义与复用,增强代码的可维护性;与 React、Vue 等框架结合,提供更佳的开发体验;适用于大型项目,优化代码结构和性能。随着 Web 技术的发展,TypeScript 的应用前景广阔,将继续引领 Web 开发的新趋势。
64 2
|
3月前
|
中间件 Go API
Go语言中几种流行的Web框架,如Beego、Gin和Echo,分析了它们的特点、性能及适用场景,并讨论了如何根据项目需求、性能要求、团队经验和社区支持等因素选择最合适的框架
本文概述了Go语言中几种流行的Web框架,如Beego、Gin和Echo,分析了它们的特点、性能及适用场景,并讨论了如何根据项目需求、性能要求、团队经验和社区支持等因素选择最合适的框架。
222 1
|
3月前
|
前端开发 JavaScript 开发工具
从框架到现代Web开发实践
从框架到现代Web开发实践
69 1
|
4月前
|
XML JSON API
ServiceStack:不仅仅是一个高性能Web API和微服务框架,更是一站式解决方案——深入解析其多协议支持及简便开发流程,带您体验前所未有的.NET开发效率革命
【10月更文挑战第9天】ServiceStack 是一个高性能的 Web API 和微服务框架,支持 JSON、XML、CSV 等多种数据格式。它简化了 .NET 应用的开发流程,提供了直观的 RESTful 服务构建方式。ServiceStack 支持高并发请求和复杂业务逻辑,安装简单,通过 NuGet 包管理器即可快速集成。示例代码展示了如何创建一个返回当前日期的简单服务,包括定义请求和响应 DTO、实现服务逻辑、配置路由和宿主。ServiceStack 还支持 WebSocket、SignalR 等实时通信协议,具备自动验证、自动过滤器等丰富功能,适合快速搭建高性能、可扩展的服务端应用。
261 3
|
2月前
|
前端开发 安全 JavaScript
2025年,Web3开发学习路线全指南
本文提供了一条针对Dapp应用开发的学习路线,涵盖了Web3领域的重要技术栈,如区块链基础、以太坊技术、Solidity编程、智能合约开发及安全、web3.js和ethers.js库的使用、Truffle框架等。文章首先分析了国内区块链企业的技术需求,随后详细介绍了每个技术点的学习资源和方法,旨在帮助初学者系统地掌握Dapp开发所需的知识和技能。
2025年,Web3开发学习路线全指南
|
3月前
|
设计模式 前端开发 数据库
Python Web开发:Django框架下的全栈开发实战
【10月更文挑战第27天】本文介绍了Django框架在Python Web开发中的应用,涵盖了Django与Flask等框架的比较、项目结构、模型、视图、模板和URL配置等内容,并展示了实际代码示例,帮助读者快速掌握Django全栈开发的核心技术。
269 45
|
3月前
|
存储 前端开发 JavaScript
如何在项目中高效地进行 Web 组件化开发
高效地进行 Web 组件化开发需要从多个方面入手,通过明确目标、合理规划、规范开发、加强测试等一系列措施,实现组件的高效管理和利用,从而提高项目的整体开发效率和质量,为用户提供更好的体验。
55 7
|
3月前
|
前端开发 API 开发者
Python Web开发者必看!AJAX、Fetch API实战技巧,让前后端交互如丝般顺滑!
在Web开发中,前后端的高效交互是提升用户体验的关键。本文通过一个基于Flask框架的博客系统实战案例,详细介绍了如何使用AJAX和Fetch API实现不刷新页面查看评论的功能。从后端路由设置到前端请求处理,全面展示了这两种技术的应用技巧,帮助Python Web开发者提升项目质量和开发效率。
87 1
|
3月前
|
XML 安全 PHP
PHP与SOAP Web服务开发:基础与进阶教程
本文介绍了PHP与SOAP Web服务的基础和进阶知识,涵盖SOAP的基本概念、PHP中的SoapServer和SoapClient类的使用方法,以及服务端和客户端的开发示例。此外,还探讨了安全性、性能优化等高级主题,帮助开发者掌握更高效的Web服务开发技巧。

热门文章

最新文章