个人中心
gpt4 book ai didi

C#使用Jquery zTree实现树状结构显示 异步数据加载

转载 作者：qq735679552 更新时间：2022-09-27 22:32:09 29 4
gpt4 key购买 nike

CFSDN坚持开源创造价值，我们致力于搭建一个资源共享平台，让每一个IT人在这里找到属于你的精彩世界.

这篇CFSDN的博客文章C#使用Jquery zTree实现树状结构显示 异步数据加载由作者收集整理，如果你对这篇文章有兴趣，记得点赞哟.

C#使用Jquery zTree实现树状结构显示_异步数据加载 。

JQuery-Ztree下载地址：https://github.com/zTree/zTree_v3 。

JQuery-Ztree数结构演示页面：  http://www.treejs.cn/v3/demo.php#_101 。

关于zTree的详细解释请看演示页面，还有zTree帮助Demo。  。

下面简要讲解下本人用到的其中一个实例（直接上关键代码了）:

异步加载节点数据：  。

A-前台:

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
< link href = "zTree_v3-master/css/zTreeStyle/zTreeStyle.css" rel = "stylesheet" />
  < script src = "zTree_v3-master/js/jquery.ztree.core.js" type = "text/javascript" ></ script >
  < script language = "JavaScript" type = "text/javascript" >
  var setting = {
   async: {
    enable: true,
    url: "../Handler/ShoppingHandler.ashx", //请求的一般处理程序
    autoParam: ["id"],       //自带参数id--来自于节点id
    otherParam: { "type": "GetUserLevelList" }, //其他参数自定义
    dataFilter: filter, //数据过滤
    type: "post" //请求方式
   }
  };
 
  function filter(treeId, parentNode, childNodes) {
   if (!childNodes) return null;
   for (var i = 0, l = childNodes.length; i & l t; l; i++) {
    childNodes[i] .name = childNodes [i].name.replace(/\.n/g, '.');
   }
   return childNodes;
  }
 
  $(document).ready(function () {
   $.fn.zTree.init($("#treeDemo"), setting); //渲染树结构
  });
  </script>
< div class = "zTreeDemoBackground left" >
   < ul id = "treeDemo" class = "ztree" ></ ul >
</ div >

B后台:

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
using MobileBusiness.Common.Data;
using MobileBusiness.Library.Passport;
using MobileBusiness.Shopping.Data;
using MobileBusiness.Shopping.Data.Common;
using MobileBusiness.Shopping.Data.Entity;
using MobileBusiness.Web.Library.Script;
using Newtonsoft.Json;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using ShoppingData = MobileBusiness.Shopping.Data.Entity;
 
namespace MobileBusiness.Shopping.BusinessManage.Handler
{
  /// <summary>
  /// Shopping 的摘要说明
  /// </summary>
  public class ShoppingHandler : IHttpHandler
  {
   //当前登录用户信息
   WeChatUser weChatUser = WeChatIdentity.CurrentUser;
 
   public void ProcessRequest(HttpContext context)
   {
    string result = "" ;
    if (context.Request[ "type" ] != null )
    {
     string requestType = context.Request[ "type" ];
 
     try
     {
      switch (requestType)
      {
       //获取用户信息等级列表
       case "GetUserLevelList" :
        result = this .GetUserLevelList(context); break ;
       default :
        break ;
      }
     }
     catch (Exception ex)
     {
      result = ex.Message;
     }
    }
 
    context.Response.ContentType = "text/html" ;
    context.Response.Write(result);
    context.Response.End();
   }
 
   private string GetUserLevelList(HttpContext context)
   {
    string parentUserPhone = context.Request[ "id" ];
    return GetUserCollByPhone(parentUserPhone);
   }
   private string GetUserCollByPhone( string phone)
   {
    //编码，父编码，名称，是否打开，打开图片，关闭图片
    //{ id:1, pId:0, name:"展开、折叠 自定义图标不同", open:true, iconOpen:"../../../css/zTreeStyle/img/diy/1_open.png", iconClose:"../../../css/zTreeStyle/img/diy/1_close.png"},
    //编码，父编码，名称，是否打开，显示图片
    //{ id: 11, pId: 1, name: "叶子节点1", icon: "../../../css/zTreeStyle/img/diy/2.png"},
    List< object > result = new List< object >();
 
    ShoppingData.UserInfoCollection userColl = ShoppingData.UserInfoAdapter.Instance.LoadByParentUserPhone(phone);
    userColl.ForEach(user =>
    {
     result.Add( new
     {
      id = user.Phone,
      pid = phone,
      name = user.UserName,
      isParent = ShoppingData.UserInfoAdapter.Instance.LoadByParentUserPhone(user.Phone).Count > 0 ? true : false
     });
    });
    return JsonConvert.SerializeObject(result);
   }
   public bool IsReusable
   {
    get
    {
     return false ;
    }
   }
  }
}

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我.

原文链接：http://www.cnblogs.com/lxhbky/archive/2016/12/18/6195053.html 。

最后此篇关于C#使用Jquery zTree实现树状结构显示 异步数据加载的文章就讲到这里了,如果你想了解更多关于C#使用Jquery zTree实现树状结构显示 异步数据加载的内容请搜索CFSDN的文章或继续浏览相关文章，希望大家以后支持我的博客！ 。

29 4 0
文章推荐： PHP实现合并两个有序数组的方法分析
文章推荐： js实现鼠标滑动到某个div禁止滚动
文章推荐： PHP实现单链表翻转操作示例
文章推荐： 原生js+css实现tab切换功能
qq735679552
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com