| 标题 | EasyUI Tree+Asp.net实现权限树或目录树导航的简单实例 |
| 范文 | 本篇文章主要是对EasyUI Tree+Asp.net实现权限树或目录树导航的简单实例进行了介绍，需要的朋友可以过来参考下，希望对大家有所帮助 代码如下: <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Main.aspx.cs" Inherits="Manage_Main" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ""> <html xmlns=""> <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 scroll="no"> <form id="form1" runat="server"> <noscript> <div> <img src="images/noscript.gif" alt='抱歉，请开启脚本支持！' /> </div> </noscript> <div region="north" split="true"> <div> <span> </span> <div> <span> </span><a href="#" id="loginOut">安全退出</a> </div> </div> <span><img src="images/blocks.gif" width="20" height="20" />网站后台通用管理系统 V1.0</span> </div> <div region="south" split="true"> <div> 网站后台通用管理系统 <%=adminname%>，您好！ 版权所有@2012</div> </div> <div region="west" hide="true" split="true" id="west"> <div id="nav" fit="true"> <!-- 导航内容 --> <div id="lefttree"></div> </div> </div> <div id="mainPanle" region="center"> <div id="tabs" fit="true" > <div > <span>欢迎进入系统</span> </div> </div> </div> <div id="mm"> <div id="mm-tabupdate">刷新</div> <div></div> <div id="mm-tabclose">关闭</div> <div id="mm-tabcloseall">全部关闭</div> <div id="mm-tabcloseother">除此之外全部关闭</div> <div></div> <div id="mm-tabcloseright">当前页右侧全部关闭</div> <div id="mm-tabcloseleft">当前页左侧全部关闭</div> <div></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 |
| 随便看 |
|
在线学习网范文大全提供好词好句、学习总结、工作总结、演讲稿等写作素材及范文模板，是学习及工作的有利工具。