Asp.net treeview实现无限级树实现代码

下面是关于"Asp.net TreeView实现无限级树实现代码"的完整攻略。

介绍

TreeView是Asp.net Web Forms中常用的一种控件，可以用于构建树形结构的网页菜单或目录。本文将介绍如何使用TreeView控件实现无限级树形菜单，并提供两个示例说明。

步骤

1. 准备数据源

为了构建无限级树形菜单，我们需要一个能够支持无限级别嵌套的数据结构。我们可以考虑使用一个包含"ID"、"父ID"和"名称"等字段的数据表来存储树形结构。

例如，下面的SQL语句可以创建一个简单的菜单数据表：

CREATE TABLE [dbo].[Menu](
    [ID] [int] IDENTITY(1,1) NOT NULL,
    [ParentID] [int] NULL,
    [Name] [nvarchar](50) NOT NULL,
 CONSTRAINT [PK_Menu] PRIMARY KEY CLUSTERED 
(
    [ID] ASC
))

然后，我们可以将一些菜单数据插入到数据表中，如下：

INSERT INTO [Menu] VALUES (NULL, '顶级菜单 1')
INSERT INTO [Menu] VALUES (NULL, '顶级菜单 2')
INSERT INTO [Menu] VALUES (1, '子菜单 1-1')
INSERT INTO [Menu] VALUES (1, '子菜单 1-2')
INSERT INTO [Menu] VALUES (2, '子菜单 2-1')

2. 设计页面

在Web Forms页面中添加TreeView控件。在ASPX页面中添加如下代码：

<asp:TreeView ID="tvMenu" runat="server" NodeIndent="10"></asp:TreeView>

控件的"NodeIndent"属性用于指定节点之间的缩进距离。

3. 绑定数据

在ASP.NET页面代码中的Page_Load方法中，绑定TreeView控件到数据源。我们可以使用递归的方式来遍历菜单数据，然后使用TreeNode对象的实例来创建树形节点的层次结构。

protected void Page_Load(object sender, EventArgs e)
{
    if (!IsPostBack)
        BindTreeView(null, tvMenu.Nodes);
}

private void BindTreeView(string parentId, TreeNodeCollection nodes)
{
    DataTable dt = GetChildMenus(parentId);
    foreach (DataRow row in dt.Rows)
    {
        TreeNode tn = new TreeNode(row["Name"].ToString(), row["ID"].ToString());
        nodes.Add(tn);
        BindTreeView(row["ID"].ToString(), tn.ChildNodes);
    }
}

private DataTable GetChildMenus(string parentId)
{
    DataTable dt = new DataTable();
    using (SqlConnection con = new SqlConnection("your_connection_string_here"))
    {
        string query = "SELECT * FROM Menu WHERE ParentID" + (string.IsNullOrWhiteSpace(parentId) ? " IS NULL" : "=" + parentId);
        using (SqlCommand cmd = new SqlCommand(query, con))
        {
            con.Open();
            SqlDataAdapter da = new SqlDataAdapter(cmd);
            da.Fill(dt);
        }
    }
    return dt;
}

在上述代码中，"BindTreeView"是递归遍历菜单数据的方法，而"GetChildMenus"则是查询SQL Server数据表的方法。当在Page_Load事件中调用BindTreeView( null, tvMenu.Nodes)方法时，将从根节点开始，将数据表数据绑定到TreeView控件。

4. 示例说明

示例1： 标准应用

在演示标准应用之前，我们需要将上述代码中的"your_connection_string_here"替换成你的SQL Server连接字符串。

现在，再次运行ASPX页面。你会看到TreeView控件显示了一个简单的树形菜单结构。

示例2： 添加链接

下一个示例演示如何将超链接添加到菜单中。

首先，我们需要使用HyperLink控件创建一个子页面。添加以下代码到作为节点的超链接：

<asp:HyperLink ID="hyperLink" runat="server" NavigateUrl='<%#"~/MenuDetail.aspx?MenuID="+Container.DataItem("ID") %>' Text='<%#Container.DataItem("Name") %>'></asp:HyperLink>

"Container.DataItem"属性用于获取TreeView节点绑定的数据项。在没有数据项的情况下，此属性将返回null。

接下来，在BindTreeView方法中的循环中，用以下代码替换(TreeNode对象):

TreeNode tn = new TreeNode();
HyperLink lnk = new HyperLink();
lnk.Text = row["Name"].ToString();
lnk.NavigateUrl = "~/MenuDetail.aspx?MenuID=" + row["ID"].ToString();
tn.Controls.Add(lnk);
nodes.Add(tn);

在上述代码中，我们创建了"HyperLink"控件并将控件附加到TreeNode对象的"Controls"集合中，然后再将其添加到TreeView的节点集合中。

由此，我们便可以在TreeView中为菜单项创建超链接并链接到新的子页面。

结论

本文详细介绍了如何使用Asp.net TreeView控件实现无限级树形菜单，并提供了两个示例说明。希望读者从这篇编程攻略中学到相应设计思路。