easyui Tree的使用

最新推荐文章于 2023-02-01 08:50:51 发布

qql05

最新推荐文章于 2023-02-01 08:50:51 发布

阅读量593

点赞数

分类专栏： easyui 文章标签： tree 控件递归

本文链接：https://blog.csdn.net/qql05/article/details/22416075

版权

easyui 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

1. 获取tree的数据：

前端（aspx）：

  <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="TreeTest.aspx.cs" Inherits="UI.Sy_Funtion.TreeTest" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <link rel="stylesheet" type="text/css" href="../themes/default/easyui.css" />
    <link rel="stylesheet" type="text/css" href="../themes/icon.css" />
    <script type="text/javascript" src="../Scripts/jquery-1.8.0.min.js"></script>
    <script type="text/javascript" src="../Scripts/jquery.easyui.min.js"></script>
    <script type="text/javascript" src="../Scripts/locale/easyui-lang-zh_CN.js"></script>
</head>
<body>
     <ul id="tb" class="easyui-tree">
        </ul>
       
      <script>

            $('#tb').tree({
                //url: "Tree.ashx/ProcessRequest",
                              url:"Tree.asmx/getjson",
                loadFilter: function (data) {
                    if (data.d) {
                        return data.d;
                    } else {
                        return data;
                    }
                }
            });  


        </script>
    
   
</body>
</html>

1.tree的数据格式为json，具体代码为：

[{    
    "id": 1,    
    "text": "Node 1",    
    "state": "closed",    
    "children": [{    
        "id": 11,    
        "text": "Node 11"   
    },{    
        "id": 12,    
        "text": "Node 12"   
    }]    
},{    
    "id": 2,    
    "text": "Node 2",    
    "state": "closed"   
}]  

[{    
    "id": 1,    
    "text": "Node 1",    
    "state": "closed",    
    "children": [{    
        "id": 11,    
        "text": "Node 11"   
    },{    
        "id": 12,    
        "text": "Node 12"   
    }]    
},{    
    "id": 2,    
    "text": "Node 2",    
    "state": "closed"   
}]

2.利用三层在数据库中获取到datable格式数据后转换成tree所需的装换格式，根据服务控件的获取的方法利用递归生成树：

1. 服务控件treeview的后台方法（调用为Bind_Tv(tb(), this.TreeView1.Nodes, "0", "Funtion_Id", "Funtion_Pid", "Funtion_name");）

 private void Bind_Tv(DataTable dt, TreeNodeCollection tns, string pid_val, string id, string pid, string text)
        {
            TreeNode tn;
            DataView dv = new DataView(dt);//将DataTable存到DataView中以便于筛选数据
            //建TreeView的节点（TreeNode）以便将取出的数据添加到节点中
            //以下为三元运算符，如果父为空，则为构建父字段is null的查询条件，否则构建父id字段=父id字段值的查询条件
            string filter = string.IsNullOrEmpty(pid_val) ? pid + " is null" : string.Format(pid + "='{0}'", pid_val);
            dv.RowFilter = filter;//用DataView将数据进行筛选，选出相同父id值的数据
            foreach (DataRowView drv in dv)
            {
                tn = new TreeNode();//建立一个新节点
                tn.Value = drv[id].ToString();//节点的Value值，一般为数据库的id值
                tn.Text = drv[text].ToString();//节点的Text，节点的文本显示
                tns.Add(tn);//将该节点加入到TreeNodeCollection（节点集合）
                Bind_Tv(dt, tn.ChildNodes, tn.Value, id, pid, text);//递归（反复调用这个方法直到把数据取完为止）
            }
        }

2. easyui tree 的后台代码：

tree.ashx:

 public void ProcessRequest(HttpContext context)
        {
            //context.Response.ContentType = "text/plain";
            //context.Response.Write("Hello World");
            DataTable dt = BF.GetList("").Tables[0];
            string json = getTree(dt, "0", "Funtion_Pid", "Funtion_name", "Funtion_Id");
            json = json.Remove(json.Length - 2, 2);
            context.Response.Write(json);
        }

        public bool IsReusable
        {
            get
            {
                return false;
            }
        }
        private string getTree(DataTable dt, string id, string ParId_name, string text_name, string id_name)
        {
            StringBuilder stringbuilder = new StringBuilder();
            DataRow[] CRow = dt.Select(ParId_name + "=" + id);
            if (CRow.Length > 0)
            {
                stringbuilder.Append("[");
                for (int i = 0; i < CRow.Length; i++)
                {
                    string chidstring = getTree(dt, CRow[i][id_name].ToString(), ParId_name, text_name, id_name);
                    if (!string.IsNullOrEmpty(chidstring))
                    {
                        stringbuilder.Append("{ \"id\":\"" + CRow[i][id_name].ToString() + "\",\"text\":\"" + CRow[i][text_name].ToString() + "\",\"state\":\"closed\",\"children\":");
                        stringbuilder.Append(chidstring);
                    }
                    else
                    {

                        stringbuilder.Append("{\"id\":\"" + CRow[i][id_name].ToString() + "\",\"text\":\"" + CRow[i][text_name].ToString() + "\"},");

                    }
                }
                stringbuilder.Replace(',', ' ', stringbuilder.Length - 1, 1);
                stringbuilder.Append("]},");
            }
            return stringbuilder.ToString();
        } 

    }

Tree.asmx:

 [WebMethod]
        [ScriptMethod(ResponseFormat = ResponseFormat.Json)]
        public void getjson()
        {
            DataTable dt = BF.GetList("").Tables[0];
            string json=getTree(dt, "0", "Funtion_Pid", "Funtion_name", "Funtion_Id");
            json=json.Remove(json.Length-2,2);
            Context.Response.Write(json);
            


            
        }
       
        private string getTree(DataTable dt, string id, string ParId_name, string text_name, string id_name)
        {
            StringBuilder stringbuilder = new StringBuilder();
            DataRow[] CRow = dt.Select(ParId_name + "=" + id);
            if (CRow.Length > 0)
            {
                stringbuilder.Append("[");
                for (int i = 0; i < CRow.Length; i++)
                {
                    string chidstring = getTree(dt, CRow[i][id_name].ToString(), ParId_name, text_name, id_name);
                    if (!string.IsNullOrEmpty(chidstring))
                    {
                        stringbuilder.Append("{ \"id\":\"" + CRow[i][id_name].ToString() + "\",\"text\":\"" + CRow[i][text_name].ToString() + "\",\"state\":\"closed\",\"children\":");
                        stringbuilder.Append(chidstring);
                    }
                    else
                    {
                      
                            stringbuilder.Append("{\"id\":\"" + CRow[i][id_name].ToString() + "\",\"text\":\"" + CRow[i][text_name].ToString() + "\"},");
                        
                    }
                }
                stringbuilder.Replace(',', ' ', stringbuilder.Length - 1, 1);
                stringbuilder.Append("]},");
            }
            return stringbuilder.ToString();
        }