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,如需转载请自行联系原作者
相关文章
|
1天前
|
缓存 监控 安全
Django框架在大型Web应用中的架构设计与实战
【5月更文挑战第18天】Django框架在构建大型Web应用中扮演重要角色,采用分层架构(数据、业务逻辑、表示层)和多应用组织模式,结合缓存策略(如Memcached、Redis)提升性能。通过异步处理、分布式部署提高响应速度和扩展性。关注数据分区、安全设计及监控日志,确保系统高效、稳定。Django为复杂业务提供坚实基础,助力打造卓越Web系统。
18 7
|
1天前
|
开发框架 中间件 数据库
Django 框架入门全攻略:轻松构建 Web 应用
【5月更文挑战第18天】本文是 Django 入门教程,介绍了如何使用 Django 构建 Web 应用。内容包括安装、项目与应用创建、模型定义、数据库迁移、视图编写、路由配置、模板系统、表单处理和中间件的使用。通过实例展示了 Django 基本流程,帮助初学者快速上手。Django 提供高效工具,便于开发者聚焦业务逻辑,轻松构建功能丰富的 Web 应用。
16 5
|
1天前
|
存储 缓存 API
Flask 框架在大型 Web 应用中的使用与挑战
【5月更文挑战第18天】Flask框架适用于快速开发轻量级Web应用,但用于大型应用时需应对性能、代码管理和团队协作的挑战。通过集成扩展处理复杂需求,使用蓝图组织代码,以及引入缓存优化性能,结合明确的代码规范和开发流程,可有效应对挑战,构建高效稳定的应用。
15 5
|
1天前
|
数据库连接 Python
Flask 框架入门与实践:构建你的第一个 Web 应用
【5月更文挑战第18天】本文介绍了使用 Flask 框架构建第一个 Web 应用的步骤。首先通过 `pip install Flask` 安装框架,然后编写基本的 Python 代码创建应用,包括定义路由和响应。示例展示如何显示 "Hello, World!",并扩展到显示用户信息的功能。利用模板(如 `index.html`)可使页面更丰富。随着学习深入,可以利用 Flask 的更多特性,如表单处理和数据库连接,来构建更复杂的 Web 应用。本文旨在激发读者对 Flask 和 Web 开发的兴趣,鼓励不断探索和实践。
15 7
|
5天前
|
开发框架 前端开发 .NET
ASP.NET CORE 3.1 MVC“指定的网络名不再可用\企图在不存在的网络连接上进行操作”的问题解决过程
ASP.NET CORE 3.1 MVC“指定的网络名不再可用\企图在不存在的网络连接上进行操作”的问题解决过程
48 0
|
4天前
|
开发框架 前端开发 JavaScript
JavaScript云LIS系统源码ASP.NET CORE 3.1 MVC + SQLserver + Redis医院实验室信息系统源码 医院云LIS系统源码
实验室信息系统(Laboratory Information System,缩写LIS)是一类用来处理实验室过程信息的软件,云LIS系统围绕临床,云LIS系统将与云HIS系统建立起高度的业务整合,以体现“以病人为中心”的设计理念,优化就诊流程,方便患者就医。
23 0
|
4天前
|
开发框架 前端开发 .NET
进入ASP .net mvc的世界
进入ASP .net mvc的世界
32 0
|
4天前
mvc.net分页查询案例——mvc-paper.css
mvc.net分页查询案例——mvc-paper.css
5 0
|
4天前
|
开发框架 前端开发 .NET
C# .NET面试系列六:ASP.NET MVC
<h2>ASP.NET MVC #### 1. MVC 中的 TempData\ViewBag\ViewData 区别? 在ASP.NET MVC中,TempData、ViewBag 和 ViewData 都是用于在控制器和视图之间传递数据的机制,但它们有一些区别。 <b>TempData:</b> 1、生命周期 ```c# TempData 的生命周期是短暂的,数据只在当前请求和下一次请求之间有效。一旦数据被读取,它就会被标记为已读,下一次请求时就会被清除。 ``` 2、用途 ```c# 主要用于在两个动作之间传递数据,例如在一个动作中设置 TempData,然后在重定向到另
122 5
|
5天前
|
XML 前端开发 定位技术
C#(NET Core3.1 MVC)生成站点地图(sitemap.xml)
C#(NET Core3.1 MVC)生成站点地图(sitemap.xml)
33 0