Select/Highlight Parent when child node is clicked

[kith]

Hello Everyone!

I have a radtreeview which I want to select/highlight Parent when child node is clicked. It doesn't mater if it's going to be done via client-side (JS and change the parent's css and highlight it?) or server-side (select the parent node which in effect highlights it)

Is it possible?

Thanks!

[kith]

By the way, to clarify I only want to apply it on leaf nodes. I have a multilevel treeview which makes other child nodes, a parent  to other nodes. I hope this clears things up.

Thanks!

[Veronica]

Hi kith,

As I understand you want to select all parent nodes only for the leaf nodes of the RadTreeView. Here's the solution in Javascipt and code-behind:

JavaScript:

function OnClientNodeClickedHandler(sender, args) {
           if (args.get_node().get_allNodes().length == 0) {
               SelectNode(args.get_node());
           }
       }
       function SelectNode(node) {
           if (node.get_parent() != null) {
               node.get_parent().set_selected(true);
               SelectNode(node.get_parent());
           }
       }

C#:

protected void RadTreeView1_NodeClick(object sender, RadTreeNodeEventArgs e)
    {
        if (e.Node.GetAllNodes().Count == 0)
            SelectParents(e.Node);
    }

    protected void SelectParents(RadTreeNode node)
    {
        if (node.ParentNode != null)
        {
            node.ParentNode.Selected = true;
            SelectParents(node.ParentNode);
        }
    }

ASPX:

Please note that you need to enable the multiple select of nodes in the RadTreeView in order to achieve your requirement. This can be done by setting the MultipleSelect property to true:

<telerik:RadTreeView runat="server" ID="RadTreeView1" _OnClientNodeClicked="OnClientNodeClickedHandler"
            OnNodeClick="RadTreeView1_NodeClick" MultipleSelect="true">
            <Nodes>
                <telerik:RadTreeNode runat="server" Text="Root RadTreeNode1">
                    <Nodes>
                        <telerik:RadTreeNode runat="server" Text="Child RadTreeNode 1">
                            <Nodes>
                                <telerik:RadTreeNode runat="server" Text="Child RadTreeNode 1">
                                </telerik:RadTreeNode>
                            </Nodes>
                        </telerik:RadTreeNode>
                        <telerik:RadTreeNode runat="server" Text="Child RadTreeNode 2">
                        </telerik:RadTreeNode>
                    </Nodes>
                </telerik:RadTreeNode>
                <telerik:RadTreeNode runat="server" Text="Root RadTreeNode2">
                    <Nodes>
                        <telerik:RadTreeNode runat="server" Text="Child RadTreeNode 1">
                        </telerik:RadTreeNode>
                        <telerik:RadTreeNode runat="server" Text="Child RadTreeNode 2">
                        </telerik:RadTreeNode>
                    </Nodes>
                </telerik:RadTreeNode>
            </Nodes>
        </telerik:RadTreeView>

Best wishes,
Veronica Milcheva
the Telerik team

[kith]

Hi Veronica,

Thanks for your reply. I tested the code you've posted, it worked but I only want to highlight the parent of the leaf node I clicked and NOT all its parents. How do I do that?

[kith]

I got it now.

Thanks!

[abdulmajeed]

Can you tell how you do it?