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开发者更轻 ...
随机推荐
- 简述Centos系统启动流程
1. Centos5 POST开机自检 运行CMOS中的BIOS程序,加载第一个启动磁盘的Bootloader 由Bootloader读取kernel 通过挂载临时根目录initramfs加载核心模块 ...
- python re模块与正则
1. re模块 1.1 转义符 正则表达式中的转义符在python的字符串中也刚好有转移的作用,但是正则表达式中的转义符和字符串中的转义符并没关系,且还容易有冲突. 为了避免这种冲突,我们所有的正则都 ...
- BZOJ 5106 [CodePlus2017]汀博尔
[题解] 二分答案.r要设好,不能随便设置为max(s,len),不然check的时候会爆long long #include<cstdio> #include<algorithm& ...
- 【19】AngularJS 应用
AngularJS 应用 现在是时候创建一个真正的 AngularJS 单页 Web 应用(single page web application,SPA)了. AngularJS 应用实例 现在可以 ...
- 浅谈href=与href=javascript_void(0)的区别
"#"包含了一个位置信息.默认的锚点是#top 也就是网页的顶端.而javascript:void(0) 仅仅表示一个死链接,这就是为什么有的时候页面很长,浏览链接明明是#可是跳 ...
- NYOJ 832 合并游戏
合并游戏 时间限制:1000 ms | 内存限制:65535 KB 难度:4 描述 大家都知道Yougth除了热爱编程之外,他还有一个爱好就是喜欢玩.某天在河边玩耍的时候,他发现了一种神奇的石 ...
- Android三角标签View：TriangleLabelView
Android三角标签View:TriangleLabelView 在一些商城.产品推销类APP中,如淘宝.京东.电影门票销售.商品降价促销这类的APP,常常会在其APP中看到,某些商品的左上角 ...
- noip模拟赛 排列
[问题描述] 给出一个随机的排列,请你计算最大值减最小值的差小于等于0~n-1的区间分别有多少个. 输入格式 输入文件名为sum.in. 第一行一个数T(<=10),表示数据组数 对于每一组数据 ...
- [bzoj1563][NOI2009]诗人小G（决策单调性优化）
题目:http://www.lydsy.com:808/JudgeOnline/problem.php?id=1563 分析: 首先可得朴素的方程:f[i]=min{f[j]+|s[j]-j-s[i] ...
- pga_aggregate_target, sga_target, memory_target
对于这三个参数有一些了解,但是又有一些疑惑. pga_aggregate_target 最初的了解: 这个参数控制着PGA的大小,如果work_area_policy 设置成auto,则oracle采 ...