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,然后定义一个 ...
随机推荐
- Java基础学习 —— 对象的克隆
对象的克隆分为对象的浅克隆和深克隆 一.对象的浅克隆 注意事项: 1.如果一个对象需要调用clone的方法克隆,那么该对象必须要实现Cloneable接口 2.Cloneable对象只是一个标识对象, ...
- 转：【Java集合源码剖析】TreeMap源码剖析
前言 本文不打算延续前几篇的风格(对所有的源码加入注释),因为要理解透TreeMap的所有源码,对博主来说,确实需要耗费大量的时间和经历,目前看来不大可能有这么多时间的投入,故这里意在通过于阅读源码对 ...
- JSP小记
0.配置servlet的模板 1.找Jar文件:\Common\plugins (myeclipse.ini文件中查看) * com.genuitec.eclipse.wizards*.jar 2.找 ...
- 201521123034 《Java程序设计》第9周学习总结
1. 本周学习总结 1.1 以你喜欢的方式(思维导图或其他)归纳总结异常相关内容. 2. 书面作业 本次PTA作业题集异常 常用异常 题目5-1 1.1 截图你的提交结果(出现学号) 1.2 自己以前 ...
- Java课程设计---团队博客
课设题目:购物车系统 题目要求: 1．先建立一个文本文件,定义出自己想要的商品.//也可用数据库以商品编号:商品名称:商品品牌:价格作为文件的内容,中间要求用分号或者分割 2．编写程序,定义一个商品类 ...
- 201521123068 《java程序设计》 第11周学习总结
1. 本周学习总结 1.1 以你喜欢的方式(思维导图或其他)归纳总结多线程相关内容. 多线程的冲突:同时运行的线程需要访问共享数据(临界资源) 多线程的互斥访问:两个或两个以上的线程需要同时对同一数据 ...
- 聊一聊我的阿里云ECS云主机
javaweb学习有段时间了,期间也编写了一些自己的小webapp应用,但是都是发布在我们自己的个人pc上的. 于是我在想:怎么样让自己的项目可以发到公网上面去,让朋友们能够来访问? 我首先想到的是: ...
- Spring Boot Maven Plugin（一）：repackage目标
简介 Spring Boot Maven Plugin插件提供spring boot在maven中的支持.允许你打包可运行的jar包或war包. 插件提供了几个maven目标和Spring Boot ...
- [13] static 和 final
不论是类.属性,还是方法的声明中,都有一个可设置的"修饰符",它可以实现一些高级特性. 1.static static被称之为静态的,并不是指不可以修改的意思,而是说它的内存空间是 ...
- 如何定制 Calico 的 IP 池？- 每天5分钟玩转 Docker 容器技术（71）
在前面的小节中,我们没有特别配置,calico 会为自动为网络分配 subnet,当然我们也可以定制. 首先定义一个 IP Pool,比如: cat << EOF | calicoctl ...