C#使用Jquery zTree實現(xiàn)樹狀結(jié)構(gòu)顯示 異步數(shù)據(jù)加載
C#使用Jquery zTree實現(xiàn)樹狀結(jié)構(gòu)顯示_異步數(shù)據(jù)加載
JQuery-Ztree下載地址:https://github.com/zTree/zTree_v3
JQuery-Ztree數(shù)結(jié)構(gòu)演示頁面: http://www.treejs.cn/v3/demo.php#_101
關(guān)于zTree的詳細(xì)解釋請看演示頁面,還有zTree幫助Demo。
下面簡要講解下本人用到的其中一個實例(直接上關(guān)鍵代碼了):
異步加載節(jié)點數(shù)據(jù):
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"],       //自帶參數(shù)id--來自于節(jié)點id
   otherParam: { "type": "GetUserLevelList" }, //其他參數(shù)自定義
   dataFilter: filter, //數(shù)據(jù)過濾
   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); //渲染樹結(jié)構(gòu)
 });
 </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
 {
  //當(dāng)前登錄用戶信息
  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)
  {
   //編碼,父編碼,名稱,是否打開,打開圖片,關(guān)閉圖片
   //{ id:1, pId:0, name:"展開、折疊 自定義圖標(biāo)不同", open:true, iconOpen:"../../../css/zTreeStyle/img/diy/1_open.png", iconClose:"../../../css/zTreeStyle/img/diy/1_close.png"},
   //編碼,父編碼,名稱,是否打開,顯示圖片
   //{ id: 11, pId: 1, name: "葉子節(jié)點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;
   }
  }
 }
}
以上就是本文的全部內(nèi)容,希望對大家的學(xué)習(xí)有所幫助,也希望大家多多支持我們。
上一篇:淺析C#中結(jié)構(gòu)與類的區(qū)別
欄 目:C#教程
下一篇:C# 6.0 的知識梳理
本文標(biāo)題:C#使用Jquery zTree實現(xiàn)樹狀結(jié)構(gòu)顯示 異步數(shù)據(jù)加載
本文地址:http://www.jygsgssxh.com/a1/C_jiaocheng/6065.html
您可能感興趣的文章
- 01-10C#使用Dispose模式實現(xiàn)手動對資源的釋放
 - 01-10C#3.0使用EventLog類寫Windows事件日志的方法
 - 01-10C#使用windows服務(wù)開啟應(yīng)用程序的方法
 - 01-10c# ArrayList的使用方法小總結(jié)
 - 01-10C#使用ADO.Net部件來訪問Access數(shù)據(jù)庫的方法
 - 01-10C#使用Mutex簡單實現(xiàn)程序單實例運行的方法
 - 01-10使用Nopcommerce為商城添加滿XX減XX優(yōu)惠券功能
 - 01-10C#中yield用法使用說明
 - 01-10C#編程和Visual Studio使用技巧(下)
 - 01-10C#編程和Visual Studio使用技巧(上)
 


閱讀排行
本欄相關(guān)
- 01-10C#通過反射獲取當(dāng)前工程中所有窗體并
 - 01-10關(guān)于ASP網(wǎng)頁無法打開的解決方案
 - 01-10WinForm限制窗體不能移到屏幕外的方法
 - 01-10WinForm繪制圓角的方法
 - 01-10C#實現(xiàn)txt定位指定行完整實例
 - 01-10WinForm實現(xiàn)仿視頻播放器左下角滾動新
 - 01-10C#停止線程的方法
 - 01-10C#實現(xiàn)清空回收站的方法
 - 01-10C#通過重寫Panel改變邊框顏色與寬度的
 - 01-10C#實現(xiàn)讀取注冊表監(jiān)控當(dāng)前操作系統(tǒng)已
 
隨機閱讀
- 01-11ajax實現(xiàn)頁面的局部加載
 - 01-10delphi制作wav文件的方法
 - 01-10C#中split用法實例總結(jié)
 - 01-10使用C語言求解撲克牌的順子及n個骰子
 - 04-02jquery與jsp,用jquery
 - 08-05dedecms(織夢)副欄目數(shù)量限制代碼修改
 - 01-10SublimeText編譯C開發(fā)環(huán)境設(shè)置
 - 08-05織夢dedecms什么時候用欄目交叉功能?
 - 01-11Mac OSX 打開原生自帶讀寫NTFS功能(圖文
 - 08-05DEDE織夢data目錄下的sessions文件夾有什
 


