文档章节

EasyUI Tree+Asp.net实现权限树或目录树导航

深圳大道
 深圳大道
发布于 2016/12/29 15:36
字数 1147
阅读 11
收藏 0
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Main.aspx.cs" Inherits="Manage_Main" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>网站后台通用管理系统,<%=adminname%>,您好!</title>
    <link href="Css/default.css" rel="stylesheet" type="text/css" />
    <!--easyui-->
    <link rel="stylesheet" type="text/css" href="easyui/themes/default/easyui.css" />
    <link rel="stylesheet" type="text/css" href="easyui/themes/default/tree.css" />
    <link rel="stylesheet" type="text/css" href="easyui/themes/icon.css" />
    <script type="text/javascript" src="easyui/jquery-1.8.0.min.js"></script>
    <script type="text/javascript" src="easyui/jquery.easyui.min.js"></script>
    <script type="text/javascript" src='EasyUI/JQLoader.js'> </script>
    <script type="text/javascript" src='EasyUI/outlook.js'> </script>
    <script type="text/javascript">
        $(function () {
            $('#lefttree').tree({
                animate: true,
                checkbox: false,
                url: 'GetTreeDataFromDB.ashx?father=0',
                onClick: function (node) {
                    if (node.attributes != "") {
                        addTab(node.text, node.attributes, node.id);
                    }
                },
                onLoadSuccess: function (node, data) {
                    $('#lefttree').show();
                }
            });

            $('#loginOut').click(function () {
                $.messager.confirm('系统提示', '您确定要退出本次登录吗?', function (r) {
                    if (r) {
                        location.href = 'LoginExit.ashx';
                    }
                });
            })
        });
    </script>
    </head>
    <body class="easyui-layout" style="overflow-y: hidden"  scroll="no">
    <form id="form1" runat="server">
      <noscript>
      <div style=" position:absolute; z-index:100000; height:2046px;top:0px;left:0px; width:100%; background:white; text-align:center;"> <img src="images/noscript.gif" alt='抱歉,请开启脚本支持!' /> </div>
      </noscript>
      <div region="north" split="true" border="false" style="overflow: hidden; height: 60px;
        background: url(images/layout-browser-hd-bg.gif) #7f99be repeat-x center 50%;
        line-height: 20px;color: #fff; font-family: Verdana, 微软雅黑,黑体">
        <div style="float:right;padding-top:5px;padding-right:20px;text-align:right;"> <span class="head">       </span>
          <div style=" margin-top:6px;" class="head"> <span class="icon icon-quit"> </span><a href="#" id="loginOut">安全退出</a> </div>
        </div>
        <span style="padding-left:10px; font-size: 16px; "><img src="images/blocks.gif" width="20" height="20" align="absmiddle" />网站后台通用管理系统 V1.0</span> </div>
      <div region="south" split="true" style="height: 30px; background: #D2E0F2; ">
        <div class="footer"> 网站后台通用管理系统 <%=adminname%>,您好! 版权所有@2012</div>
      </div>
      <div region="west" hide="true" split="true" title="导航菜单" style="width:180px;" id="west">
        <div id="nav" class="easyui-accordion" fit="true" border="false"> 
          <!--  导航内容 -->
          <div id="lefttree" style="margin:5px;"></div>
        </div>
      </div>
      <div id="mainPanle" region="center" style="background: #eee; overflow-y:hidden">
        <div id="tabs" class="easyui-tabs"  fit="true" border="false" >
          <div title="欢迎使用" style="padding:20px;overflow:hidden; " > <span style="font-size:18px;">欢迎进入系统</span> </div>
        </div>
      </div>
      <div id="mm" class="easyui-menu" style="width:150px;">
        <div id="mm-tabupdate">刷新</div>
        <div class="menu-sep"></div>
        <div id="mm-tabclose">关闭</div>
        <div id="mm-tabcloseall">全部关闭</div>
        <div id="mm-tabcloseother">除此之外全部关闭</div>
        <div class="menu-sep"></div>
        <div id="mm-tabcloseright">当前页右侧全部关闭</div>
        <div id="mm-tabcloseleft">当前页左侧全部关闭</div>
        <div class="menu-sep"></div>
        <div id="mm-exit">退出</div>
      </div>
    </form>
</body>
</html>
<%@ WebHandler Language="C#" Class="GetTreeDataFromDB" %>

using System;
using System.Web;
using System.Configuration;
using System.Data;
using System.Text;
using System.Collections.Generic;
//add
using System.Web.Script.Serialization;

public class GetTreeDataFromDB : IHttpHandler
{

    public void ProcessRequest(HttpContext context)
    {
        context.Response.ContentType = "text/plain";

        //获取数据库中的分类数据
        string fatherid = context.Request.QueryString["father"];
        DataTable dt = createDT();

        string json = GetTreeJsonByTable(dt, "module_id", "module_name","module_url", "module_fatherid", "0");
        context.Response.Write(json);
        context.Response.End();        
    }

    #region 根据DataTable生成EasyUI Tree Json树结构
    StringBuilder result = new StringBuilder();
    StringBuilder sb = new StringBuilder();    
    /// <summary>
    /// 根据DataTable生成EasyUI Tree Json树结构
    /// </summary>
    /// <param name="tabel">数据源</param>
    /// <param name="idCol">ID列</param>
    /// <param name="txtCol">Text列</param>
    /// <param name="url">节点Url</param>
    /// <param name="rela">关系字段</param>
    /// <param name="pId">父ID</param>
    private string GetTreeJsonByTable(DataTable tabel, string idCol, string txtCol, string url, string rela, object pId)
    {
        result.Append(sb.ToString());
        sb.Clear();
        if (tabel.Rows.Count > 0)
        {
            sb.Append("[");
            string filer = string.Format("{0}='{1}'", rela, pId);
            DataRow[] rows = tabel.Select(filer);
            if (rows.Length > 0)
            {
                foreach (DataRow row in rows)
                {
                    sb.Append("{\"id\":\"" + row[idCol] + "\",\"text\":\"" + row[txtCol] + "\",\"attributes\":\"" + row[url] + "\",\"state\":\"open\"");
                    if (tabel.Select(string.Format("{0}='{1}'", rela, row[idCol])).Length > 0)
                    {
                        sb.Append(",\"children\":");
                        GetTreeJsonByTable(tabel, idCol, txtCol,url, rela, row[idCol]);
                        result.Append(sb.ToString());
                        sb.Clear();
                    }
                    result.Append(sb.ToString());
                    sb.Clear();
                    sb.Append("},");
                }
                sb = sb.Remove(sb.Length - 1, 1);
            }
            sb.Append("]");
            result.Append(sb.ToString());
            sb.Clear();
        }
        return result.ToString();
    }
    #endregion 


    #region 创建数据
    protected static DataTable createDT()
    {
        DataTable dt = new DataTable();
        dt.Columns.Add("module_id");
        dt.Columns.Add("module_name");
        dt.Columns.Add("module_fatherid");
        dt.Columns.Add("module_url");
        dt.Columns.Add("module_order");

        dt.Rows.Add("C1", "全国", "0", "1.aspx", "1");
        dt.Rows.Add("M01", "广东", "C1", "2.aspx", "1");

        dt.Rows.Add("M0101", "深圳", "M01", "3.aspx", "100");
        dt.Rows.Add("M010101", "南山区", "M0101", "4.aspx", "1000");
        dt.Rows.Add("M010102", "罗湖区", "M0101", "", "1001");
        dt.Rows.Add("M010103", "福田区", "M0101", "", "1002");
        dt.Rows.Add("M010104", "宝安区", "M0101", "", "1003");
        dt.Rows.Add("M010105", "龙岗区", "M0101", "", "1004");

        dt.Rows.Add("M01010301", "上梅林", "M010103", "", "1002001");
        dt.Rows.Add("M01010302", "下梅林", "M010103", "", "1002002");
        dt.Rows.Add("M01010303", "车公庙", "M010103", "", "1002003");
        dt.Rows.Add("M01010304", "竹子林", "M010103", "", "1002004");
        dt.Rows.Add("M01010305", "八卦岭", "M010103", "", "1002005");
        dt.Rows.Add("M01010306", "华强北", "M010103", "", "1002006");

        dt.Rows.Add("M0102", "广州", "M01", "", "101");
        dt.Rows.Add("M010201", "越秀区", "M0102", "", "1105");
        dt.Rows.Add("M010202", "海珠区", "M0102", "", "1106");
        dt.Rows.Add("M010203", "天河区", "M0102", "", "1107");
        dt.Rows.Add("M010204", "白云区", "M0102", "", "1108");
        dt.Rows.Add("M010205", "黄埔区", "M0102", "", "1109");
        dt.Rows.Add("M010206", "荔湾区", "M0102", "", "1110");
        dt.Rows.Add("M010207", "罗岗区", "M0102", "", "1111");
        dt.Rows.Add("M010208", "南沙区", "M0102", "", "1112");
        return dt;
    }
    #endregion


    public bool IsReusable
    {
        get
        {
            return false;
        }
    }
}

#region 根据DataTable生成EasyUI Tree Json树结构  
    StringBuilder result = new StringBuilder();  
    StringBuilder sb = new StringBuilder();      
    /// <summary>  
    /// 根据DataTable生成EasyUI Tree Json树结构  
    /// </summary>  
    /// <param name="tabel">数据源</param>  
    /// <param name="idCol">ID列</param>  
    /// <param name="txtCol">Text列</param>  
    /// <param name="url">节点Url</param>  
    /// <param name="rela">关系字段</param>  
    /// <param name="pId">父ID</param>  
    private string GetTreeJsonByTable(DataTable tabel, string idCol, string txtCol, string url, string rela, object pId)  
    {  
        result.Append(sb.ToString());  
        sb.Clear();  
        if (tabel.Rows.Count > 0)  
        {  
            sb.Append("[");  
            string filer = string.Format("{0}='{1}'", rela, pId);  
            DataRow[] rows = tabel.Select(filer);  
            if (rows.Length > 0)  
            {  
                foreach (DataRow row in rows)  
                {  
                    sb.Append("{\"id\":\"" + row[idCol] + "\",\"text\":\"" + row[txtCol] + "\",\"attributes\":\"" + row[url] + "\"");  
                    if (tabel.Select(string.Format("{0}='{1}'", rela, row[idCol])).Length > 0)  
                    {  
                        //点击展开
                        sb.Append(",\"state\":\"closed\",\"children\":");  
                        GetTreeJsonByTable(tabel, idCol, txtCol,url, rela, row[idCol]);  
                        result.Append(sb.ToString());  
                        sb.Clear();  
                    }  
                    result.Append(sb.ToString());  
                    sb.Clear();  
                    sb.Append("},");  
                }  
                sb = sb.Remove(sb.Length - 1, 1);  
            }  
            sb.Append("]");  
            result.Append(sb.ToString());  
            sb.Clear();  
        }  
        return result.ToString();  
    }  
    #endregion


本文转载自:http://blog.csdn.net/smartsmile2012/article/details/8496753

深圳大道
粉丝 3
博文 877
码字总数 0
作品 0
深圳
架构师
私信 提问
python递归实现Easyui combotree树

原文链接:http://www.huangdc.com/43 自动化发布系统在选择文件时,使用jQuery EasyUI 创建页面 树形菜单(Tree) 及 后端python 递归实现Easyui combotree 树。这里主要分享2点: 1、linux 中...

dchuang
2014/11/19
0
0
EasyUI的功能树之异步树

最近几个项目都用到了EasyUI这个Jquery框架,目前感觉起来还是很好使的,展示效果很好,帮助文档什么的资料很多,而且互联网上Easy粉很多,大多数拥护和喜爱EasyUI的粉丝们都愿意在网络平台互...

易水寒丶开源
2015/11/17
0
1
EasyUI 1.5.x Of Insdep Theme 1.0.0 RC2 发布

JQuery EasyUI 1.5.x Of Insdep Theme 1.0.0 RC2 下方附部分美化截图 关于 Insdep theme是基于EasyUI 1.5.x 的一款免费的美化主题包,拥有百度编辑器、cropper、Highcharts、justgage、plupl...

magicweng
2017/02/27
2K
5
easyui tree异步加载

easyui tree的异步加载实现很简单,easyui的中文API文档中有实例(http://api.btboys.com/easyui/)——创建异步树形菜单,就是在tree node 元素中要有一个id属性,同时还需要state的属性(s...

菠萝啊哈哈
2013/04/11
0
0
jQuery EasyUI使用教程之创建可折叠面板

<jQuery EasyUI最新版下载> 在本教程中,你将学习到有关于easyui折叠面板的知识。折叠面板包含了一系列的面板,其中所有的面板标题都是可见的,但只有一个面板的主体内容在某个时间是可见的。...

Miss_Hello_World
2015/11/13
0
0

没有更多内容

加载失败,请刷新页面

加载更多

AOP的学习(1)

AOP 理解AOP编程思想(面向方法、面向切面) spring AOP的概念 方面 -- 功能 目标 -- 原有方法 通知 -- 对原有方法增强的方法 连接点 -- 可以用来连接通知的地方(方法) 切入点 -- 将用来插入...

太猪-YJ
11分钟前
0
0
一张图看懂亮度、明度、光度、光亮度、明亮度

亮度、明度、光亮度,Luminance和Brightness、lightness其实都是一个意思,只是起名字太难了。 提出一个颜色模型后,由于明度的取值与别人的不同,为了表示区别所以就另想一个词而已。 因此在...

linsk1998
昨天
0
0
Python应用:python链表示例

前言 python链表应用源码示例,需要用到python os模块方法、函数和类的应用。 首先,先简单的来了解下什么是链表?链表是一种物理存储单元上非连续、非顺序的存储结构,数据元素的逻辑顺序是...

python小白1
昨天
2
0
Source Insight加载源码

Source Insight是一个图形化的源代码查看工具(当然也可以作为编译工具)。如果一个项目的源代码较多,此工具可以很方便地查找到源代码自建的依赖关系。 1.创建工程 下图为Snort源代码的文件...

天王盖地虎626
昨天
2
0
nginx-rtmp-module的缺陷分析(二)

nginx-rtmp-module使用指令push和pull来relay媒体流数据,以便分布式部署服务。 当nginx-rtmp-module作为边缘服务器(一般不会向边缘服务器推流)时,使用pull从源服务器获取媒体流数据,俗称...

YoungSagit
昨天
1
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部