突出显示选定的 TreeNode答案

【问题标题】：Highlighting the selected TreeNode突出显示选定的 TreeNode
【发布时间】：2016-03-23 17:02:20
【问题描述】：

如何在 ASP.NET 中突出显示选定的 TreeNode (UI.WebControls)？目的是让用户看到他或她当时正在查看的类别。

我的想法是，在每个 TreeNode 上，检查其属性 Selected 是否为真，然后将其字体或其他内容更改为另一种颜色。我已经阅读过有关设置“ForeColor”的信息，但这种类型的 TreeNode 似乎不存在。

另一个想法是为每个节点添加某种 JavaScript。

例如，今天的代码如下所示：

private void BuildTree()
    {
        TreeNode nodeNew = new TreeNode("Unread", MessageFolder.New.ToString());

        TreeNode nodeProcessed = new TreeNode("Read", MessageFolder.Processed.ToString());

        TreeViewFolders.Nodes.Add(nodeNew);
        TreeViewFolders.Nodes.Add(nodeProcessed);
    }

【问题讨论】：

标签： c# asp.net treeview

【解决方案1】：

您必须在 ASPX 页面上使用服务器控件，您可以指定

<asp:TreeView id="LinksTreeView"
            Font-Names= "Arial"
            ForeColor="Blue"
            SelectedNodeStyle-ForeColor="Green"
            SelectedNodeStyle-VerticalPadding="0"
            OnSelectedNodeChanged="Select_Change"   
            runat="server">

试试这个，更多信息请查看this page

【讨论】：

【解决方案2】：

以下是在 ASP.NET 4.0 中使用 Web 表单在母版页中解决问题的一种方法。

在演示页面中，您可以有一个 TreeView，如下所示：

<asp:TreeView
    ID="tv"
    runat="server"
    SelectedNodeStyle-BorderStyle="Solid"
    SelectedNodeStyle-HorizontalPadding="5"
    SelectedNodeStyle-VerticalPadding="5" 
    onselectednodechanged="tv_SelectedNodeChanged">
    <Nodes>
        <asp:TreeNode Text="Contact" Value="~/General/Contact.aspx"></asp:TreeNode>
        <asp:TreeNode Text="Change login name" Value="~/General/ChangeLoginName.aspx"></asp:TreeNode>
        <asp:TreeNode Text="Change password" Value="~/General/ChangePassword.aspx"></asp:TreeNode>
        <asp:TreeNode Text="Terms and Policies" Value="~/General/TermsOfUse.aspx"></asp:TreeNode>
    </Nodes>
</asp:TreeView></td>

这里需要注意的重要事项是：

(1) 导航的 URL 分配给“Value”属性，而不是 TreeNode 类的“NavigateUrl”属性。

(2) 我们已经为选中的节点定义了样式。

(3) 我们定义了一个事件“onselectednodechanged”。一个简单的方法是在设计视图中双击 TreeView。这还会在代码隐藏文件中创建一个事件处理程序存根，稍后我们将使用它。

在代码隐藏文件中，只需要以下三个函数：

protected void HighlightSelectedLink(TreeNodeCollection nodes, string treeViewSelectedValue)
{
    if (!string.IsNullOrEmpty(treeViewSelectedValue))
    {
        foreach (TreeNode tn in nodes)
        {
            if (tn.Value == treeViewSelectedValue)
            {
                tn.Selected = true;
            }
            else
            {
                tn.Selected = false;
            }

            HighlightSelectedLink(tn.ChildNodes, treeViewSelectedValue);
        }
    }
}

protected void tv_SelectedNodeChanged(object sender, EventArgs e)
{
    string treeViewSelectedValue = tv.SelectedValue;

    if (treeViewSelectedValue.EndsWith(".aspx"))
    {
        Response.BufferOutput = true;
        Response.Redirect(tv.SelectedValue);
    }
}

protected void Page_PreRender(object sender, EventArgs e)
{
    string treeViewSelectedValue = Request.AppRelativeCurrentExecutionFilePath;

    if (!string.IsNullOrEmpty(treeViewSelectedValue))
    {
        TreeNodeCollection nodes = tv.Nodes;
        HighlightSelectedLink(nodes, treeViewSelectedValue);
    }
}

第二个函数就是上面提到的handler。

【讨论】：

【解决方案3】：

在 c# 后面的代码中：

protected void tv_SelectedNodeChanged(object sender, EventArgs e)
{
    TreeView tv = (TreeView)sender;
    tv.SelectedNodeStyle.ForeColor = System.Drawing.Color.MidnightBlue;
    tv.SelectedNodeStyle.BackColor = System.Drawing.Color.PowderBlue;
    tv.SelectedNodeStyle.Font.Bold = true;
}

【讨论】：