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,然后定义一个 ...
随机推荐
- 百度AI开放平台- API实战调用
百度AI开放平台- API实战调用 一. 前言 首先说一下项目需求. 两个用户,分别上传了两段不同的文字,要计算两段文字相似度有多少,匹配数据库中的符合条件的数据,初步估计列出来会有60-1 ...
- 建立maven工程pom.xml报错：web.xml is missing and <failOnMissingWebXml> is set to true
解决方式:如图添加web.xml文件即可
- [转载]python 详解re模块
原文地址:python 详解re模块作者:Rocky 正则表达式的元字符有. ^ $ * ? { [ ] | ( ) ．表示任意字符 ［］用来匹配一个指定的字符类别,所谓的字符类别就是你想匹配的一个字 ...
- 【Java线程】Java内存模型总结
学习资料:http://www.infoq.com/cn/articles/Java-memory-model-1 Java的并发采用的是共享内存模型(而非消息传递模型),线程之间共享程序的公共状态, ...
- centos6 内核优化
以下为部分优化参数,具体优化方法还要看情况而定 [root@localhost ~]# vi /etc/sysctl.conf #末尾添加如下参数 net.ipv4.tcp_syncookie ...
- 1st_homework_SE--四则运算题目生成器
0x00 Code 查询源代码及README请点此 0x01 需求分析 实现一个自动生成小学四则运算题目的命令行程序. 0x02 功能设计 主要功能为: 接受用户输入以便知道要出多少道题目python ...
- 201521123008 《Java程序设计》 第九周学习总结
1. 本周学习总结 2. 书面作业 本次PTA作业题集异常 1.常用异常 题目5-1 1.1 截图你的提交结果(出现学号) 1.2 自己以前编写的代码中经常出现什么异常.需要捕获吗(为什么)?应如何避 ...
- Hibernate第八篇【懒加载】
前言 前面在使用Hibernate的时候就提及过了懒加载,但没有好好地说明具体的说明究竟是怎么回事-本博文主要讲解懒加载 什么是拦截器以及为什么要使用懒加载? 懒加载就是当使用数据的时候才去获取数据. ...
- java线程池相关知识点总结
Android中常见到的很多通用组件一般都离不开"池"的概念,如各种图片加载库,网络请求库,即使Android的消息传递机制中的Meaasge当使用Meaasge.obtain() ...
- vmware三种网络格式
网络地址转换(NAT) 这种访问模式指的是虚拟机不占用主机所在局域网的ip,通过使用主机的NAT功能访问局域网和互联网,意味着虚拟机可以访问局域网中的其他电脑,但是其他电脑不知道虚拟机的存在. 使用这 ...