突出显示选定的树节点

本文关键字:树节点 显示 | 更新日期: 2023-09-27 17:56:51

如何突出显示选定的 TreeNode (UI.网络控件)在 ASP.NET?目的是让用户看到他或她当时正在查看哪个类别。

我的想法是,在每个 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);
    }

突出显示选定的树节点

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

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

试试这个,有关更多信息,请查看此页面

下面是在

母版页中使用 Web 窗体解决 ASP.NET 4.0 中问题的一种方法。

在演示文稿页中,您可以拥有如下所示的树视图:

<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"。执行此操作的一种简单方法是双击"设计视图"中的树视图。这还会在代码隐藏文件中创建一个事件处理程序存根,我们稍后将使用该存根。

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

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);
    }
}

第二个函数是上面提到的处理程序。

在 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;
}