Want to disable collapse in RadDropDownTree

[Clark]

Is there a way to completely disable collapsing of the RadDropDownTree control?

I want to be able to collapse and expand all the nodes, I just don't want users to be able to completely collapse the control.

In other words, I want to use it like RadTreeView but with the benefit of RadDropDownTree filtering.

Thanks!

--Clark

 

[Peter Milchev]

Hello Clark,

**Update**

The original reply was addressing the collapse prevention of the nodes of the Embedded TreeView while the OP question is about preventing the collapse of the dropdown of the DropDownTree. Sharing the solution code from the comments for convenience:

To prevent the dropdown collapse, you can cancel the client event of the DropDownTree itself - OnClientDropDownClosing:

 

function OnClientDropDownClosing(sender, args) {
    // custom condition to decide if the dropdown should stay open
    if (true) {
        // prevent the dropdown close
        args.set_cancel(true)
    }
}

 

**End of Update**

You can use the OnClientNodeCollapsing event of the embedded TreeView and cancel it:

• https://docs.telerik.com/devtools/aspnet-ajax/controls/dropdowntree/how-to/accessing-the-embedded-tree 
• https://docs.telerik.com/devtools/aspnet-ajax/controls/treeview/client-side-programming/events/onclientnodecollapsing 

 

<script>
    function OnClientNodeCollapsing(sender, args) {
        args.set_cancel(true);
    }
</script>
<telerik:RadDropDownTree RenderMode="Lightweight" ID="RadDropDownTree1" runat="server" Width="350px" DefaultMessage="Select an entry from the list" EnableFiltering="true" 
    OnLoad="RadDropDownTree1_Load" OnNodeDataBound="RadDropDownTree1_NodeDataBound" >
    <DropDownSettings Width="350px" />
</telerik:RadDropDownTree>

 

 

protected void RadDropDownTree1_NodeDataBound(object sender, DropDownTreeNodeDataBoundEventArguments e)
{
    e.DropDownTreeNode.Expanded = true;
        
}

protected void RadDropDownTree1_Load(object sender, EventArgs e)
{
    (sender as RadDropDownTree).EmbeddedTree.OnClientNodeCollapsing = "OnClientNodeCollapsing";
}

 

Regards,
Peter Milchev
Progress Telerik

[Clark]

Hi Peter and thanks for your response.

First off I changed this line from:

(sender as RadDropDownTree).EmbeddedTree.OnClientNodeCollapsing = "OnClientNodeCollapsing";

To:

(sender as RadDropDownTree).RadDropDownTree1.EmbeddedTree.OnClientNodeCollapsing = "OnClientNodeCollapsing";

I then run it and I get this error on that same line:

 

Here is where the Script is:

Here is the Telerik RadDropDownTreecontrol:

Thanks for your help!

--Clark

 

[Peter Milchev]

Hi Clark, the sender argument of the NodeDataBound handler is actually the control that fired the event. In this case, the RadDropDownTree that fired NodeDataBound is the sender but represented as an object, and that is why I cast it to a RadDropDownTree. 

In this specific case, "sender as RadDropDownTree" and "RadDropDownTree1" will be the same exact thing. The first approach gives the benefit of reusing the same handler for multiple RadDropDownTrees without having a specific reference in the handler itself. 

[Clark]

Thanks Peter, can you tell me why I'm getting the error?

Also, when I try:

(sender as RadDropDownTree).EmbeddedTree.OnClientNodeCollapsing = "OnClientNodeCollapsing";

I get a red line under .EmbeddedTree indicating that it is an invalid method.  That's why I used:

(sender as RadDropDownTree).RadDropDownTree1.EmbeddedTree.OnClientNodeCollapsing = "OnClientNodeCollapsing";

where it is a valid method.

 

--Clark

[Peter Milchev]

Hi Clark, it is important that the code I have shared is added to the Load event of the RadDropDownTree as that is when the sender would actually be the RadDropDownTree. 

On the other hand, if you have only a single DropDownTree, then you can replace the (sender as RadDropDownTree) with the direct reference to the control via its ID  RadDropDownTree1 similar to how you configure its data properties.

RadDropDownTree1.EmbeddedTree.OnClientNodeCollapsing = "OnClientNodeCollapsing";

[Clark]

Hi Peter,

Thanks so much for taking the time to help me on this.  :-)

I just created a new clean project and now I'll apply your suggestions and see what happens.

Thanks again.,

--Clark

 

 

[Clark]

Hello Peter,

I configured it per your instructions and here is what's happening:

1.  The RadDropDownTree itself doesn't load expanded even after I added OpenDropDownOnLoad="true".  I want it to load expanded and display the primary nodes just like RadTreeView. 

2.  On load and when I expand the RadDropDownTree, the primary nodes automatically expand to reveal the secondary nodes and then once expanded I can't collapse the primary nodes.   I don't want the primary nodes to automatically expand and I want to be able to collapse and expand all nodes.   I want it to initially display the primary nodes just like a RadTreeView.

3.  I can collapse the entire RadDropDownTree.  The main point of this exercise is to not have the RadDropDownTree collapse.

Here is my aspx section:

 
<script>
           function OnClientNodeCollapsing(sender, args) {
               args.set_cancel(true);
           }
       </script><telerik:RadDropDownTree RenderMode="Lightweight" ID="RadDropDownTree1" runat="server" Width="350px" DefaultMessage="Select an entry from the list" EnableFiltering="true" 
    OnLoad="RadDropDownTree1_Load" OnNodeDataBound="RadDropDownTree1_NodeDataBound" OnClientLoad="OnClientNodeCollapsing" ><DropDownSettings Width="350px" OpenDropDownOnLoad="true" /></telerik:RadDropDownTree>
 
Here is how I want it to load.  I don't want to be able to collapse the control.
Here is what I want it to look like when I expand the nodes. I want to be able to expand and collapse all the nodes.
 

[Peter Milchev]

Hi Clark, I am terribly sorry for misunderstanding, it seems you want to prevent the dropdown closing, not the treeview node collapse. 

If that is the case, then you can remove all the code above and just cancel the client event of the DropDownTree itself - OnClientDropDownClosing:

function OnClientDropDownClosing(sender, args) {
    // custom condition to decide if the dropdown should stay open
    if (true) {
        // prevent the dropdown close
        args.set_cancel(true)
    }
}

[Clark]

Hey Peter,

Good news....it works!

The dropdown no longer closes.

Thanks for hanging in there to help me resolve this issue.

Nice job!   :-)

--Clark

 

 

 

[Peter Milchev]

Thanks for confirming it, Clark, I am happy that you finally achieved the desired functionality. 

I have also edited my initial reply to include the answer to your real question in case someone else visits this thread.