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-前台:
<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; 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后台:
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; } } } }
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持我们。
上一篇:浅析C#中结构与类的区别
栏 目:C#教程
下一篇:C# 6.0 的知识梳理
本文标题:C#使用Jquery zTree实现树状结构显示 异步数据加载
本文地址:https://www.xiuzhanwang.com/a1/C_jiaocheng/6065.html
您可能感兴趣的文章
阅读排行
本栏相关
- 01-10C#通过反射获取当前工程中所有窗体并
- 01-10关于ASP网页无法打开的解决方案
- 01-10WinForm限制窗体不能移到屏幕外的方法
- 01-10WinForm绘制圆角的方法
- 01-10C#实现txt定位指定行完整实例
- 01-10WinForm实现仿视频播放器左下角滚动新
- 01-10C#停止线程的方法
- 01-10C#实现清空回收站的方法
- 01-10C#通过重写Panel改变边框颜色与宽度的
- 01-10C#实现读取注册表监控当前操作系统已
随机阅读
- 01-11ajax实现页面的局部加载
- 01-10delphi制作wav文件的方法
- 01-10C#中split用法实例总结
- 01-10使用C语言求解扑克牌的顺子及n个骰子
- 04-02jquery与jsp,用jquery
- 08-05dedecms(织梦)副栏目数量限制代码修改
- 01-10SublimeText编译C开发环境设置
- 08-05织梦dedecms什么时候用栏目交叉功能?
- 01-11Mac OSX 打开原生自带读写NTFS功能(图文
- 08-05DEDE织梦data目录下的sessions文件夹有什