前台代码
<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 + "]");