easyui -tree的详细讲解
代码的具体实现
@{
ViewBag.Title = "人员查找";
ViewBag.LeftWidth = "200px";
ViewBag.MiddleWidth = "200px";
}
<html>
<head>
<link href="../../../Script/easyui/themes/bootstrap/easyui.css" rel="stylesheet" type="text/css" />
<link href="../../../Script/easyui/themes/icon.css" rel="stylesheet" type="text/css" />
<link href="../../../Content/themes/base/Common/common.css" rel="stylesheet" type="text/css" />
<script src="../../../Script/easyui/jquery-1.8.3.min.js" type="text/javascript"></script>
<script src="../../../Script/Common/json2.js" type="text/javascript"></script>
<script src="../../../Script/easyui/jquery.easyui.min.js" type="text/javascript"></script>
<script src="../../../Script/easyui/easyui-lang-zh_CN.js" type="text/javascript"></script>
<script src="../../../Script/Common/Toolbar.js" type="text/javascript"></script>
<script src="../../../Script/easyui/plugins/JValidator.js" type="text/javascript"></script>
<script src="../../../Script/Common/Common.js" type="text/javascript"></script>
</head>
<body class="easyui-layout">
<div region="west" title="公司" id="leftDepTree" split="true" style="width: 300px;">
<div style="border: 1px;">
<ul id="ParentOrgTree" class="easyui-tree">
</ul>
</div>
</div>
<div data-options="region:'center',title:'选择部门'" >
<div style="border: 1px;">
<ul id="ChildrenTree" class="easyui-tree">
</ul>
</div>
</div>
<div data-options="region:'east',title:'部门',split:true , fit:true" style="width:300px;">
<table id="OrgList" class="easyui-datagrid" fitColumns="true" data-options="fit:true,border:false"
checkOnSelect:"true" singleselect="false">
<thead>
<tr>
<th field="ck" width="50" checkbox="true">
</th>
<th field="OrganizationId" hidden= "true" width="50">
</th>
<th field="FullName" width="50">
部门名称
</th>
</tr>
</thead>
</table>
</div>
<div data-options="region:'south',title:'South Title',split:true" style="height:100px;"></div>
</body>
</html>
<script type="text/javascript">
//页面加载按部门搜索部门树列表
var myOrg = {
//加载子公司
onloadParentOrgTree: function () { //部门树方法
$('#ParentOrgTree').tree({
checkbox: false,
url: '../SearchDep/getParentOrg',
onClick: function (node) {
//flag代表着开关， D表示加载部门信息
myOrg.onloadChildrenTree(node.id); //加载部门
}
});
},
//加载子公司下的部门
onloadChildrenTree: function (parentID) {
$('#ChildrenTree').tree({
checkbox: true,
multiple: true,
cascadeCheck: false,
url: '../SearchDep/getChildren?parentID=' + parentID,
onClick: function (node) {
//flag代表着开关， D表示加载部门信息
},
//列表加载成功后
onLoadSuccess: function (node, data) {
myOrg.SelectChildrenTree(node, data);
},
//点击点击不选中的时候
onSelect: function (node) {
//选择的时候就要让checkbox打钩
$('#ChildrenTree').tree("check", node.target); //不用选择的时候
},
onCheck: function (node, checked) { //选择的时候
if (checked == true) {
myOrg.addOrgList(node.id, node.text);
} else {
//去掉选择框的时候去掉右侧栏
myOrg.deleteSingleOrgLiset(node.id);
}
}
});
},
//同时去掉列表
unSelectChildrenTree: function (orgid) {
var nodes = $('#ChildrenTree').tree('getChecked');
for (var i = 0; i < nodes.length; i++) {
if (nodes[i].id == orgid) {
$('#ChildrenTree').tree('uncheck', nodes[i].target);
}
}
},
//加载树列表执行回调打钩
SelectChildrenTree: function (node, data) {
var orgdata = $('#OrgList').datagrid('getData');
var arryList = []; //存放索引的值
for (var i = 0; i < orgdata.total; i++) {
for (var k = 0; k < data.length; k++) {
if (orgdata.rows[i].OrganizationId == data[k].id) {
var node = $('#ChildrenTree').tree('find', data[k].id);
arryList.push(node.target);
}
}
}
for (var i = 0; i < arryList.length; i++) {
$('#ChildrenTree').tree('check', arryList[i]);
}
},
onloadOrgList: function () {
$("#OrgList").datagrid({
onUnselect: function (rowIndex, rowData) {
$('#OrgList').datagrid('deleteRow', rowIndex); //删除当前行
myOrg.unSelectChildrenTree(rowData.OrganizationId); //同时也去除s树上的节点
},
onLoadSuccess: function (data) { //接收data
},
//全部不选中
onUnselectAll: function (rows) {
myOrg.deleteAllOrgList(rows); //删除所用的列表
}
});
$('#OrgList').datagrid('checkAll'); //默认全部选中
},
//加载选择之后的列表
addOrgList: function (OrganizationId, FullName) {
//增加时候判断如果有的话就不需要增加了
var contains = false;
var data = $('#OrgList').datagrid('getData');
if (data.total == 0) {
$('#OrgList').datagrid('insertRow', {
index: 1, // index start with 0
row: { "OrganizationId": OrganizationId, "FullName": FullName }
});
}
else {
for (var i = 0; i < data.total; i++) {
if (data.rows[i].OrganizationId == OrganizationId) {
contains = true;
break;
}
}
if (!contains) {
$('#OrgList').datagrid('insertRow', {
index: 1, // index start with 0
row: { "OrganizationId": OrganizationId, "FullName": FullName }
});
}
}
$('#OrgList').datagrid('checkAll'); //默认全部选中
},
//删除单条数据
deleteSingleOrgLiset: function (orgID) {
var data = $('#OrgList').datagrid('getData');
for (var i = 0; i < data.total; i++) {
if (data.rows[i].OrganizationId == orgID) {
$('#OrgList').datagrid('deleteRow', i);
}
}
myOrg.unSelectChildrenTree(orgID);
},
//去除OrgList的列表项
deleteAllOrgList: function (rows) {
var nodes = $('#ChildrenTree').tree('getChecked');
var arryList = [];
for (var i = (rows.length - 1); i >= 0; i--) {
for (var k = 0; k < nodes.length; k++) {
if (nodes[k].id == rows[i].OrganizationId) {
arryList.push(nodes[i].target);
}
}
$('#OrgList').datagrid('deleteRow', i); //删除list列表
}
for (var i = 0; i < arryList.length; i++) {
$('#ChildrenTree').tree('uncheck', arryList[i]);
}
},
//返回选择数据
retureOrgListData: function () { //返回提交EmpList表中的数据
var orgData = $('#OrgList').datagrid('getData');
return orgData.rows;
}
}
//页面初始化
$(function () {
myOrg.onloadParentOrgTree();
myOrg.onloadOrgList();
});
</script>
、、、、、
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Collections;
using System.Web.Mvc;
using System.Web;
using System.Data;
using GWork.Models;
using Newtonsoft.Json;
using GWork.DataAccess;
using GWork.Business;
using GWork.IBusiness;
using SysManager.Models;
using SysManager.Common.Utilities;
using Newtonsoft.Json.Converters;
namespace GWork.Controllers.OpenWindows.SearchEmployee
{
public class SearchDepController : Controller
{
private SYS_User userinfo = new SYS_User();
private SYS_Organization organizationinfo = new SYS_Organization(); //权限表中的组织部门
private SysManager.IBusiness.IOrganizationBLL organizationibll = SysManager.Business.BusinessFactory.Instance.CreateOrganization();//部门工厂
private SysManager.IBusiness.IRolesBLL rolesbll = SysManager.Business.BusinessFactory.Instance.CreateRoles();//角色工厂
private SysManager.IBusiness.IUserBLL userbll = SysManager.Business.BusinessFactory.Instance.CreateUser();// 获取员工用户方法
public ActionResult SearchDepList()
{
return View();
}
#region 加载父级节点子组织
/// <summary>
/// 加载子公司
/// </summary>
/// <returns></returns>
public string getParentOrg()
{
System.Collections.IList orgainList = organizationibll.GetList();//获取部门方法
IsoDateTimeConverter timeConverter = new IsoDateTimeConverter();
timeConverter.DateTimeFormat = "yyyy'-'MM'-'dd' 'HH':'mm':'ss";
List<SYS_Organization> listtree = SysManager.Common.Utilities.IListHelper.IListToList<SYS_Organization>(orgainList);//将IList 转化成List
SYS_Organization orgobj = listtree.Find(org => org.ParentId == "0");//构造顶级节点//（数据库中用的是O）//顶级节点
List<LEFTTREE> parentList = new List<LEFTTREE>();
LEFTTREE lefttree = new LEFTTREE();
List<LEFTTREE> CHILDRENLIST = new List<LEFTTREE>();
lefttree.ID = orgobj.OrganizationId; //树节点
lefttree.TEXT = orgobj.FullName; //公司名称
lefttree.EX1 = orgobj.Category;// （额外条件种类）
//得到分公司的父级节点
IEnumerable<SYS_Organization> FindTree = listtree.Where(new Func<SYS_Organization, bool>(d => d.ParentId == orgobj.OrganizationId));
foreach (SYS_Organization item in FindTree)
{
LEFTTREE childre = new LEFTTREE();
childre.ID = item.OrganizationId; //树节点
childre.TEXT = item.FullName; //公司名称
childre.EX1 = orgobj.Category;// （额外条件种类）
CHILDRENLIST.Add(childre);
}
lefttree.CHILDREN = CHILDRENLIST;
parentList.Add(lefttree);
return JsonConvert.SerializeObject(parentList).Replace("TEXT", "text").Replace("ID", "id").Replace("CHILDREN", "children");
}
#endregion
#region 加载子节点组织
/// <summary>
/// 加载子节点
/// </summary>
/// <returns></returns>
public string getChildren()
{
string parentID = Request["parentID"].ToString();
System.Collections.IList orgainList = organizationibll.GetList();//获取部门方法
IsoDateTimeConverter timeConverter = new IsoDateTimeConverter();
timeConverter.DateTimeFormat = "yyyy'-'MM'-'dd' 'HH':'mm':'ss";
List<SYS_Organization> listtree = SysManager.Common.Utilities.IListHelper.IListToList<SYS_Organization>(orgainList);//将IList 转化成List
LEFTTREE lefttree = new LEFTTREE();
lefttree.CHILDREN = new List<LEFTTREE>();
TreeDiGui(parentID, lefttree, listtree); //递归用法
return JsonConvert.SerializeObject(lefttree.CHILDREN).Replace("TEXT", "text").Replace("ID", "id").Replace("CHILDREN", "children");
}
#endregion
#region 共用递归
public LEFTTREE TreeDiGui(string ParentId, LEFTTREE LEFTTREE, IEnumerable<SYS_Organization> ALLTREE)
{
IEnumerable<SYS_Organization> FindTree = ALLTREE.Where(new Func<SYS_Organization, bool>(d => d.ParentId == ParentId));
foreach (SYS_Organization item in FindTree)
{
LEFTTREE ChildTree = new LEFTTREE();
ChildTree.ID = item.OrganizationId;
ChildTree.TEXT = item.FullName;
ChildTree.CHILDREN = new List<LEFTTREE>();
ChildTree.EX1 = item.Category;//种类
LEFTTREE.CHILDREN.Add(ChildTree);
TreeDiGui(ChildTree.ID, ChildTree, ALLTREE);
}
return LEFTTREE;
}
#endregion
}
}
| -- |
easyui -tree的详细讲解的更多相关文章
- head标签详细讲解
head标签详细讲解 head位于html网页的头部,后前的标签,并以开始以结束的一html标签. Head标签位置如图: head标签示意图 head包含标签 meta,title,link,bas ...
- 详细讲解nodejs中使用socket的私聊的方式
详细讲解nodejs中使用socket的私聊的方式 在上一次我使用nodejs+express+socketio+mysql搭建聊天室,这基本上就是从socket.io的官网上的一份教程式复制学习,然 ...
- iOS KVC详细讲解
iOS KVC详细讲解 什么是KVC? KVC即NSKeyValueCoding,就是键-值编码的意思.一个非正式的 Protocol,是一种间接访问对象的属性使用字符串来标识属性,而不是通过调用存取 ...
- Easyui Tree方法扩展 - getLevel(获取节点级别)
Easyui Tree一直就没有提供这个方法,以前没有用到,所以一直没怎么在意,这次自己用到了,顺便扩展了一个方法,分享给大家. $.extend($.fn.tree.methods, { getLe ...
- [转]easyui tree 模仿ztree 使用扁平化加载json
原文地址:http://my.oschina.net/acitiviti/blog/349377 参考文章:http://www.jeasyuicn.com/demo/treeloadfilter.h ...
- 【项目经验】EasyUI Tree
ITOO5.0开始了,我参加了伟大的基础系统,从整体上来说,基础系统有三个职能: 1.自己的核心职能--选课(公共选修课,专业选修课),课表: 2.为其他系统提供真实数据: 3.维护信息 而近两三天, ...
- Android webservice的用法详细讲解
Android webservice的用法详细讲解 看到有很多朋友对WebService还不是很了解,在此就详细的讲讲WebService,争取说得明白吧.此文章采用的项目是我毕业设计的webserv ...
- Jquery EasyUI Tree .net实例
图片: 针对tree: 数据库: CREATE TABLE [dbo].[SystemModel]( [Id] [,) NOT NULL, [Name] [nvarchar]() NULL, [Fat ...
- Jquery easyui Tree的简单使用
Jquery easyui Tree的简单使用 Jquery easyui 是jQuery EasyUI是一组基于jQuery的UI插件集合,而jQuery EasyUI的目标就是帮助web开发者更轻 ...
随机推荐
- Git安装使用指南
Git安装使用指南 Git原理示意图 1. 安装git Linux服务器版本为Redhat6.2-64,其他版本可能有些许不同 1.1 安装依赖包 在安装git前首先安装依赖包,包括的依赖包有: cv ...
- 利用WebUploader进行图片批量上传，在页面显示后选择多张图片压缩至指定路径【java】
WebUploader是由Baidu WebFE(FEX)团队开发的一个简单的以HTML5为主,FLASH为辅的现代文件上传组件.在现代的浏览器里面能充分发挥HTML5的优势,同时又不摒弃主流IE浏览 ...
- Webstorm如何配置自动补全前缀--autoprefixer
我们在写样式代码时,对不同平台会有不同的兼容性写法,会在代码前加前缀,但是手动加前缀很费时间而且很容易弄错.Webstorm编辑器是有自带补全前缀功能的,那为什么还要写这篇配置博客,因为Webstor ...
- Cow Sorting POJ 3270 & HDU 2838
题目网址:http://poj.org/problem?id=3270 题目大意是:一串无序的数字,要排成增序的数列,可以交换不相邻的数,每交换两个数,sum+这两个数,使得sum最小,求最小的sum ...
- [luoguP1631] 序列合并（堆 || 优先队列）
传送门 首先,把A和B两个序列分别从小到大排序,变成两个有序队列.这样,从A和B中各任取一个数相加得到N2个和,可以把这些和看成形成了n个有序表/队列: A[1]+B[1] <= A[1]+B[ ...
- C语言试题
C语言试题 [说明]: 1.本试题中不考虑头文件引用问题(假定已经包含正确的头文件),C语言的标准函数都可用: 2.如果不特别说明,假定程序运行环境为:操作系统Windows 2000, VC6.0编 ...
- SpringBoot 拦截器--只允许进入登录注册页面，没登录不允许查看其它页面
SpringBoot注册登录(一):User表的设计点击打开链接 SpringBoot注册登录(二):注册---验证码kaptcha的实现点击打开链接 SpringBoot注册登录(三):注册--验证 ...
- BZOJ3238：[AHOI 2013]差异
求一个字符串的∑ ∑ len[i] + len[j] - 2 * lcp(i, j),其中i,j表示从i,j开始的后缀. 方法一:SA+单调栈,自行yy. 方法二:SAM构造出来,然后每个状态对答案的 ...
- 【APIO2012】【BZOJ2809】派遣dispatching
2809: [Apio2012]dispatching Time Limit: 10 Sec Memory Limit: 128 MB Submit: 1932 Solved: 967 [Submit ...
- 第8章 处理ISDN故障
第8章 处理ISDN故障 一.ISDN基本原理 二.常见ISDN故障 ISDN问题分成3类:配置不当的路由器.物理线缆和ISDN协议.配置不当的交换机. 1.配置不当的路由器 配置不当由于不同原因:t ...