文档章节

EasyUI ComboTree无限层级异步加载示例

深圳大道
 深圳大道
发布于 2016/12/29 15:37
字数 602
阅读 38
收藏 0
<%@ 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;
        }
    }
}


本文转载自:http://blog.csdn.net/smartsmile2012/article/details/53231843

深圳大道
粉丝 3
博文 877
码字总数 0
作品 0
深圳
架构师
私信 提问
EasyUI的combotree设置值问题

如图,用EasyUI的combotree做了个树形下拉框。是异步的。点父节点加载子节点。取值的时候没有问题。 问题在下面 就是往表单里设置值的时候,如果值是根节点的,能正常显示文字,如果是子节点...

雨花石
2014/09/04
6.3K
1
easyui datagrid内嵌combotree实现异步加载

jquery easyui datagrid内嵌了一个combotree。 当要实现combotree的异步加载时,部分代码语法如下: onBeforeExpand:function(node){ $('#cc').combotree("tree").tree("options").url= "tr......

hankaibo
2012/11/30
2.8K
1
jQuery-EasyUI 1.2.3 发布

Current Version: 1.2.3 ChangeLog: Bug window: Cannot resize the window with iframe content. fixed. tree: The node will be removed when dragging to its child. fixed. combogrid: T......

ejzhang
2011/04/26
6.1K
3
python递归实现Easyui combotree树

原文链接:http://www.huangdc.com/43 自动化发布系统在选择文件时,使用jQuery EasyUI 创建页面 树形菜单(Tree) 及 后端python 递归实现Easyui combotree 树。这里主要分享2点: 1、linux 中...

dchuang
2014/11/19
0
0
jquery map() easyui-treegrid easyui-combotre

具体效果可见: https://git.oschina.net/alexgaoyh/alexgaoyh.git 后台传递给前台的json数据如下: [{"deleteFlag":0,"parent.name":"","orderNo":1,"children":[{"deleteFlag":0,"parent.......

alexgaoyh
2014/10/09
0
0

没有更多内容

加载失败,请刷新页面

加载更多

JAVA 8 中新增 lambda 表达式的一些基本应用

import java.util.Arrays;import java.util.List;import java.util.function.Function;import java.util.stream.Collectors;public class TestLambda { public static void......

这是一只小小鸟
32分钟前
3
0
Java向word中插入Excel文件对象

前言: 在word文件中,虽然也有表格。但是有时我们想要将Excel中表格的大量数据直接插入到word文档中,这就需要用到word的插入对象的功能,也就是直接将Excel文件当做对象插入到word中。 本地的...

qianxi
34分钟前
2
0
海量数据下的注册中心 - SOFARegistry 架构介绍

SOFAStack Scalable Open Financial Architecture Stack 是蚂蚁金服自主研发的金融级分布式架构,包含了构建金融级云原生架构所需的各个组件,是在金融场景里锤炼出来的最佳实践。 SOFARegi...

SOFAStack
37分钟前
12
0
python操作excel表格

python 对excel的操作 提示:如果需要写多个表,需要把多个表写完在保存,否则会出现表格覆盖问题 此程序 采取一边请求,一边存取,做个异常处理,即可保存已存在的数据 """# sheet的名称,...

鹏灬
39分钟前
1
0
好程序员web前端分享如何理解JS的单线程

好程序员web前端分享如何理解JS单线程,JS本质是单线程的。也就是说,它并不能像JAVA语言那样,两个线程并发执行。 但我们平时看到的JS,分明是可以同时运作很多任务的,这又是怎么回事呢? ...

好程序员IT
43分钟前
2
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部