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=" 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="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

    }
}

--
 

原文地址:https://www.cnblogs.com/dullbaby/p/3571657.html