zTree异步调用
前台代码
<html xmlns="http://www.w3.org/1999/xhtml"><head runat="server"> <title></title> <script src="/scripts/Ztree/script/jquery-1.4.2.js" type="text/javascript"></script> <link href="/scripts/Ztree/style/zTreeStyle/zTreeStyle.css" rel="stylesheet" type="text/css" /> <link href="/scripts/Ztree/style/demoStyle/demo.css" rel="stylesheet" type="text/css" /> <script src="/scripts/Ztree/script/jquery.ztree-2.6.js" type="text/javascript"></script> <script type="text/javascript"> var zTree;// var type="CognosConnectionString";// //获取参数// var Request = new Object();// Request = GetRequest();// if (Request['type'] != null && Request['type'] != "")// type = Request['type']; var demoIframe; //setting 是 zTree 的全部设置参数集合，采用 JSON 结构，便于灵活配置 var setting = { isSimpleData: true, treeNodeKey: "id", //设置节点唯一标识属性名称 treeNodeParentKey: "pId", //设置节点的父节点唯一标识属性名称 nameCol: "name", //设置 zTree 显示节点名称的属性名称,此处默认为Name showLine: true, //在树型中是否显示线条样式 root: { //zTree数据节点的根，全部节点数据都处于 root.nodes 内 isRoot: true, nodes: [] }, async: true, asyncUrl: "AjaxHandle/GetTableField.ashx?type=<%=type %>&time="+Math.random(), asyncParam: ["id","pId","name"], //异步调用时传到后台的参数 callback:{ asyncSuccess: zTreeOnAsyncSuccess } }; var treeNodes = [<%= NodesData%>]; $(document).ready(function() { zTree = $("#treeid").zTree(setting, treeNodes); }); function zTreeOnAsyncSuccess(event, treeId, treeNode, msg) { } //读取URL function GetRequest() { var url = location.search; //获取url中"?"符后的字串 var theRequest = new Object(); if (url.indexOf("?") != -1) { var str = url.substr(1); strs = str.split("&"); for (var i = 0; i < strs.length; i++) { theRequest[strs[i].split("=")[0]] = unescape(strs[i].split("=")[1]); } } return theRequest; } function url(type) { window.location.href = "SQL.aspx?type=" + type.value; } </script></head><body> <form id="form1" runat="server"> <div> <ul id="treeid" class="tree" > </ul> </div> </form></body></html> |
后台代码：第一次调用一级数据
protected void Page_Load(object sender, EventArgs e) { if (!IsPostBack) { if (Request["type"] != null) type = Request["type"].ToString(); List<string> treenodes = new List<string>(); DataTable dt = new SystemClass(type).GetTableName(); for (int i = 0; i < dt.Rows.Count; i++) { //此处为了简化,并没有查询此级的类别是否有子类.直接设置 'isParent':true string node = string.Format("{{ \"id\":{0}, \"pId\":{1}, \"name\":\"{2}\",\"url\":\"\",\"isParent\":true}}", dt.Rows[i]["id"], dt.Rows[i]["ParentID"], dt.Rows[i]["name"]); treenodes.Add(node); } string Strtest = string.Join(",", treenodes.ToArray()); NodesData.Append(Strtest); } } |
GetTableField.ashx
异步调用返回的JOSON值
context.Response.ContentType = "text/plain"; string parentId = context.Request["id"]; string type = context.Request["type"]; List<string> treenodes = new List<string>(); StringBuilder NodesData = new StringBuilder(); DataTable dt = new SystemClass(type).GetTableFieldByParentid(parentId); for (int i = 0; i < dt.Rows.Count; i++) { //此处为了简化,并没有查询此级的类别是否有子类.直接设置 'isParent':true string node = string.Format("{{ \"id\":{0}, \"pId\":{1}, \"name\":\"{2}\",\"url\":\"\",\"isParent\":false}}", dt.Rows[i]["id"], dt.Rows[i]["ParentID"], dt.Rows[i]["name"]); treenodes.Add(node); } string Strtest = string.Join(",", treenodes.ToArray()); NodesData.Append(Strtest); context.Response.Write("[" + NodesData + "]"); |
【推荐】编程新体验，更懂你的AI，立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包，你的智能百科全书，全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell：AI 加持，快人一步
· 浏览器原生「磁吸」效果！Anchor Positioning 锚点定位神器解析
· 没有源码，如何修改代码逻辑？
· 一个奇形怪状的面试题：Bean中的CHM要不要加volatile？
· ［.NET］调用本地 Deepseek 模型
· 一个费力不讨好的项目，让我损失了近一半的绩效！
· 全网最简单！3分钟用满血DeepSeek R1开发一款AI智能客服，零代码轻松接入微信、公众号、小程
· .NET 10 首个预览版发布，跨平台开发与性能全面提升
· 《HelloGitHub》第 107 期
· 全程使用 AI 从 0 到 1 写了个小工具
· 从文本到图像：SSE 如何助力 AI 内容实时呈现？（Typescript篇）