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;
}
}
}
EasyUI ComboTree无限层级异步加载示例的更多相关文章
- 玩转Web之easyui(二)-----easy ui 异步加载生成树节点（Tree），点击树生成tab(选项卡)
关于easy ui 异步加载生成树及点击树生成选项卡,这里直接给出代码,重点部分代码中均有注释 前台: $('#tree').tree({ url: '../servlet/School_Tree?i ...
- jquery easyui easyui-treegrid 使用异步加载数据
jquery easyui easyui-treegrid 使用异步加载数据 jquery easyui easyui-treegrid 异步请求 >>>>>>&g ...
- 【EasyUI学习-2】Easyui Tree的异步加载
作者:ssslinppp 1. 摘要 2. tree的相关介绍 3. 异步加载tree数据,并实现tree的折叠展开 3.1 功能说明: 3.2 前台代码 3.3 后台代码 4. 其他 1 ...
- combotree -下拉框树异步加载
问题: 下拉树数据比较多时,全加载会产生页面延迟,需要实现异步加载 方案: 点击事件加载:先加载部分,点击节点时再展开并追加子节点 onBeforeExpand事件:在展开树前加载,感觉这种方式比较优 ...
- easyui datagrid 异步加载数据时滚动条有时会自动滚到最底部的问题
在使用easyui 的datagrid异步加载数据时发现滚动条有时会自动滚到最底部.经测试发现,如果加载数据前没有选中行则不会出现这个问题.这样我们可以在重新异步加载数据前取消选中行就可以避免这个问题 ...
- CI 笔记7，easyui 异步加载
在做后台导航时,需要异步加载,pid和id的循环问题,在controller中,建立另外一个方法,嵌套循环,查找是否pid〉1. public function nav_list() { $this- ...
- spring mvc easyui tree 异步加载树
使用spring mvc 注解 异步加载一棵树 jsp: <ul id="orgInfoTree"></ul> $(function(){ loadOrgT ...
- 【Android】纯代码创建页面布局（含异步加载图片）
开发环境:macOS 10.12 + Android Studio 2.2,MinSDK Android 5.1 先看看总体效果 本示例是基于Fragment进行的,直接上代码: [界面结构] 在 F ...
- PHP+MySQL+Easyui tree菜单从后台加载json数据(一)
实现功能:从数据库加载出所有的数据库名,相应的数据库加载对应的数据库表名 原理:(首先看一下参考手册的内容) 异步加载Tree tree 支持内置的异步加载模式,用户创建一个空的tree,然后定义一个 ...
随机推荐
- Beta版本冲刺前期计划及安排
a. 介绍小组新加入的成员,Ta担任的角色. 吴东益:经讨论决定,Ta担任角色为开发人员 李志霖:在原先的团队中负责前端开发与界面设计.现经讨论决定,Ta此次担任角色为开发人员 由他们替代原来成员陈雄 ...
- ERROR: JDWP Unable to get JNI 1.2 environment, jvm->GetEnv() return code = -2
java编程时偶尔出现运行结果下面这样的错误: ERROR: JDWP Unable to get JNI 1.2 environment, jvm->GetEnv() return code ...
- 201521123070 《JAVA程序设计》第7周学习总结
1. 本章学习总结 以你喜欢的方式(思维导图或其他)归纳总结集合相关内容. 2. 书面作业 Q1. ArrayList代码分析 1.1 解释ArrayList的contains源代码 源代码: pub ...
- 201521123086《java程序设计》第7周
本章学习总结 书面作业 1.ArrayList代码分析 1.1 解释ArrayList的contains源代码 以下是ArrayList的contains源代码: public boolean con ...
- Java十二周总结
1. 本周学习总结 1.1 以你喜欢的方式(思维导图或其他)归纳总结多流与文件相关内容. 2. 书面作业 将Student对象(属性:int id, String name,int age,doubl ...
- 201521123104《java程序设计》第13周学习总结
1. 本周学习总结 以你喜欢的方式(思维导图.OneNote或其他)归纳总结多网络相关内容. 2. 书面作业 1. 网络基础 1.1 比较ping www.baidu.com与ping cec.jmu ...
- 201521123029《Java程序设计》第14周学习总结
1. 本周学习总结 1.1 以你喜欢的方式(思维导图或其他)归纳总结多数据库相关内容. 答:1.数据库定义:为了实现一定目的按某种规则组织起来的"数据"的"集合" ...
- Hyperledger Fabric 1.0 从零开始（三）——环境构建（内网/准离线）
有公网环境的服务器可以直接看 Hyperledger Fabric 1.0 从零开始(二)--环境构建(公网) ,本篇内容与上篇相似,只不过环境搭建需要在内网下,也就是网络被限制的情况下. 1:环境构 ...
- oracle客户端plsql设置字符集
感谢一个新朋友的到来,我帮他的过程中有好些东西都不怎么想的起来了,所以从现在起我需要记录下每一点一滴, 因为我觉得写下来的东西才不会丢,而且欢迎以后的朋友到来. 使用plsql查数据的时候有时候中文会 ...
- Hibernate第十一篇【配置C3P0数据库连接池、线程Session】
Hibernate连接池 Hibernate自带了连接池,但是呢,该连接池比较简单..而Hibernate又对C3P0这个连接池支持-因此我们来更换Hibernate连接池为C3P0 查看Hibern ...