EasyUI ComboTree无限层级异步加载示例
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="EasuUIDemoTree.aspx.cs" Inherits="EasuUIDemoTree" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>EasyUI ComboTree示例</title>
<!--easyui-->
<link rel="stylesheet" type="text/css" href="../JS/jquery-easyui-1.5/themes/default/easyui.css" />
<link rel="stylesheet" type="text/css" href="../JS/jquery-easyui-1.5/themes/icon.css" />
<script type="text/javascript" src="../JS/jquery-easyui-1.5/jquery.min.js"></script>
<script type="text/javascript" src="../JS/jquery-easyui-1.5/jquery.easyui.min.js"></script>
<script type="text/javascript" src="../js/common.js"></script>
<script type="text/javascript">
$(function () {
$("#cbt").combotree({
width: 175,
url: 'EasyUIHandler.ashx?method=combotree',
valueField: 'id',
textField: 'text',
editable: false
});
});
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<input id="cbt" class="easyui-combotree"/>
</div>
</form>
</body>
</html>
<%@ WebHandler Language="C#" Class="EasyUIHandler" %>
using System;
using System.Web;
using System.Collections.Generic;
using Newtonsoft.Json;
using Newtonsoft.Json.Linq;
using System.Data;
using System.Data.SqlClient;
public class EasyUIHandler : IHttpHandler {
public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "text/plain";
int pageIndex = MSCL.RequestHelper.GetInt("page", 0); //当前页码
int pageSize = MSCL.RequestHelper.GetInt("rows", 0); //每页显示记录数
string method = MSCL.RequestHelper.GetString("method");//前台传的标示值
string JsonStr = string.Empty;
try
{
switch (method)
{
case "combotree":
//easyui 会每展开一个节点，往后端传一个·id
string parentNodeId = MSCL.RequestHelper.GetString("id") ?? null;
if (string.IsNullOrEmpty(parentNodeId))
{
parentNodeId = "0";
}
List<TreeModule> Toptree = GetSubNodes(parentNodeId);
JsonStr =Newtonsoft.Json.JsonConvert.SerializeObject(Toptree);
break;
default:
break;
}
}
catch (Exception ex)
{
throw;
}
context.Response.Write(JsonStr);
context.Response.End();
}
/// <summary>
/// * 获取菜单的树的方法*
/// </summary>
/// <param name="parentNodeId"></param>
/// <returns></returns>
public List<TreeModule> GetSubNodes(string parentNodeId)
{
DataTable dt = CreateDT();
List<TreeModule> Tree = new List<TreeModule>();
TreeModule TM = null;
if (dt != null && dt.Rows.Count > 0)
{
DataRow[] rows = dt.Select("module_fatherid ='" + parentNodeId + "'");
foreach (DataRow item in rows)
{
string id = item["module_id"].ToString();
string text = item["module_name"].ToString();
TM = new TreeModule();
DataRow[] IsNulRows = dt.Select("module_fatherid ='" + id + "'");
if (IsNulRows.Length > 0)
{
//这个很关键，此节点为closed状态，才可以展开，才能往后台传你点击的id
//看到Combotree的异步加载Demo，发现treegrid_data.json中 state="closed" 属性能把点击展开的节点Id传到后台中
TM.state = "closed";
}
TM.id = id;
TM.text = text;
Tree.Add(TM);
}
}
return Tree;
}
#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("100", "全国", "0", "", "1");
dt.Rows.Add("10001", "广东", "100", "", "1");
dt.Rows.Add("1000101", "深圳", "10001", "", "100");
dt.Rows.Add("100010101", "南山区", "1000101", "", "1000");
dt.Rows.Add("100010102", "罗湖区", "1000101", "", "1001");
dt.Rows.Add("100010103", "福田区", "1000101", "", "1002");
dt.Rows.Add("100010104", "宝安区", "1000101", "", "1003");
dt.Rows.Add("100010105", "龙岗区", "1000101", "", "1004");
dt.Rows.Add("10001010301", "上梅林", "100010103", "", "1002001");
dt.Rows.Add("10001010302", "下梅林", "100010103", "", "1002002");
dt.Rows.Add("10001010303", "车公庙", "100010103", "", "1002003");
dt.Rows.Add("10001010304", "竹子林", "100010103", "", "1002004");
dt.Rows.Add("10001010305", "八卦岭", "100010103", "", "1002005");
dt.Rows.Add("10001010306", "华强北", "100010103", "", "1002006");
dt.Rows.Add("1000102", "广州", "10001", "", "101");
dt.Rows.Add("100010201", "越秀区", "1000102", "", "1105");
dt.Rows.Add("100010202", "海珠区", "1000102", "", "1106");
dt.Rows.Add("100010203", "天河区", "1000102", "", "1107");
dt.Rows.Add("100010204", "白云区", "1000102", "", "1108");
dt.Rows.Add("100010205", "黄埔区", "1000102", "", "1109");
dt.Rows.Add("100010206", "荔湾区", "1000102", "", "1110");
dt.Rows.Add("100010207", "罗岗区", "1000102", "", "1111");
dt.Rows.Add("100010208", "南沙区", "1000102", "", "1112");
return dt;
}
#endregion
public class TreeModule
{
public string id { get; set; }
public string text { get; set; }
public string state { get; set; }
}
public bool IsReusable {
get {
return false;
}
}
}
