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

 更新时间:2016年12月19日 11:47:36   作者:深入学习ing  
这篇文章主要为大家详细介绍了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#使用ZXing.Net实现生成二维码和条码

    C#使用ZXing.Net实现生成二维码和条码

    ZXing用Java实现的多种格式的一维二维条码图像处理库,而ZXing.Net是其.Net版本的实现,下面我们就来看看 C#如何使用ZXing.Net实现生成二维码和条码吧
    2023-12-12
  • C# 使用PictureBox实现图片按钮控件的示例步骤

    C# 使用PictureBox实现图片按钮控件的示例步骤

    这篇文章主要介绍了C# 使用PictureBox实现图片按钮控件的示例步骤,帮助大家更好的理解和使用c#,感兴趣的朋友可以了解下
    2021-02-02
  • C#七大经典排序算法系列(上)

    C#七大经典排序算法系列(上)

    这篇文章主要为大家详细介绍了C#七大经典排序算法系列上篇,冒泡排序,快速排序等,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-04-04
  • C# Partial:分部方法和分部类代码实例

    C# Partial:分部方法和分部类代码实例

    这篇文章主要介绍了C# Partial:分部方法和分部类代码实例,本文直接给出代码实现,需要的朋友可以参考下
    2015-03-03
  • c# for循环中创建线程执行问题

    c# for循环中创建线程执行问题

    这篇文章主要介绍了有关c# for循环中创建线程执行问题,下面文章将将以举例的方式展开for循环中创建线程执行问题的内容,需要的朋友可以参考一下,希望对你有所帮助
    2021-11-11
  • Unity3D制作序列帧动画的方法

    Unity3D制作序列帧动画的方法

    这篇文章主要为大家详细介绍了Unity3D制作序列帧动画的方法,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2019-02-02
  • C# WinForm实现Win7 Aero透明效果代码

    C# WinForm实现Win7 Aero透明效果代码

    这篇文章主要介绍了C# WinForm实现Win7 Aero透明效果代码,通过调用dwmapi.dll相关方法实现,需要的朋友可以参考下
    2014-07-07
  • 详解C# 枚举高级用法之Description

    详解C# 枚举高级用法之Description

    这篇文章主要介绍了C# 枚举高级用法之Description,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2021-02-02
  • 浅谈C#数组(二)

    浅谈C#数组(二)

    上一篇文章我们介绍了C#数组的一部分,今天来个续文,关于C#数组想要了解更多的请看下面文章的具体内容
    2021-09-09
  • C# 实现FTP客户端的小例子

    C# 实现FTP客户端的小例子

    这篇文章主要介绍了C# 如何实现FTP客户端,文中实例代码非常详细,帮助大家更好的理解和学习,感兴趣的朋友可以了解下
    2020-07-07

最新评论