This is a migrated thread and some comments may be shown as answers.

making a node non expandable/collapsible

7 Answers 144 Views
TreeView
This is a migrated thread and some comments may be shown as answers.
Ken Payson
Top achievements
Rank 1
Ken Payson asked on 20 Feb 2009, 09:41 PM
I have a tree where the nodes can be expanded/collpsed.  (This is done client side)  I would like it if the root of the tree was not expandable/collapsible.  Is it possible to remove the expand/collapse triangle next to the root, but keep all of the other nodes the same?

Thanks,
Ken

7 Answers, 1 is accepted

Sort by
0
Shinu
Top achievements
Rank 2
answered on 23 Feb 2009, 06:23 AM
Hi Ken,

I tried the code below to set root node as not expandable/collapsible while the other node having these facilities. Hope this help you.

ASPX:
<telerik:RadTreeView ID="RadTreeView1"  Runat="server" OnClientNodeExpanding="check" OnClientNodeCollapsing="check"
    <Nodes> 
        <telerik:RadTreeNode runat="server" Text="Root"
            <Nodes> 
                <telerik:RadTreeNode runat="server" Text="Child RadTreeNode 1">                 
                    <Nodes> 
                        <telerik:RadTreeNode runat="server" Text="Child RadTreeNode 1"
                        </telerik:RadTreeNode> 
                    </Nodes> 
                </telerik:RadTreeNode> 
            </Nodes> 
        </telerik:RadTreeNode> 
    </Nodes> 
</telerik:RadTreeView> 

JavaScript:
<script type="text/javascript"
function check(sender, args) 
    if (args.get_node().get_level()==0) 
    args.set_cancel(true); 
function pageLoad() 
    var tree = $find("<%= RadTreeView1.ClientID %>"); 
    var node = tree.findNodeByText("Root"); 
    node.expand(); 
</script> 

Thanks,
Shinu.
0
İlter
Top achievements
Rank 1
answered on 13 Dec 2013, 04:56 AM
Hi,

That code works as needed. Also, RadTreeView would have a better look if the +, - images on the left side of that root node, could be disappeared. Is there a way to accomplish that scenario?

Thanks!
0
Kate
Telerik team
answered on 13 Dec 2013, 09:57 AM
Hi İlter,

To remove the plus and minus sign with the RadTreeView control you can use the following css class selector:
div.RadTreeView_Silk .rtPlus,
div.RadTreeView_Silk .rtMinus {
    background-image: none;
}

Note that if you are not using the Silk skin you will need to change the name of the selector and set the name of the skin that you currently use instead.

Regards,
Kate
Telerik
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.
0
İlter
Top achievements
Rank 1
answered on 13 Dec 2013, 10:07 AM
Thanks for the quick response!

Actually, that code removes all the +, - images on the treeview. What I meant was the parent node's collapse - expand image as it won't work and just show after implementing Shinu's code sample. I accomplished that by using Shinu's another code in that question. That code removes the image after the DOM is ready, thus, image can be seen for a second until the page loads completely. I am guessing there is no way to accomplish that ona from server side, right? :)
0
Kate
Telerik team
answered on 13 Dec 2013, 02:47 PM
Hello İlter,

You can set a css class from code behind and apply the needed settings whenever this class is set to the desired node. Below you can find the needed code and styles so you can achieve the desired functionality and look:
RadTreeView1.FindNodeByText("node1").ContentCssClass = "newClass";

styles:
<style>
       .RadTreeView_Sunset div.newClass .rtPlus,
        .RadTreeView_Sunset div.newClass .rtMinus .new {
           background-image: none;
       }
   </style>

Regards,
Kate
Telerik
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.
0
İlter
Top achievements
Rank 1
answered on 13 Dec 2013, 03:53 PM
Thanks, that one works as I want :)
With a minor change, though...
I couldn't understand why the ".new" at the end of the

.RadTreeView_Sunset div.newClass .rtMinus .new

line does. So, I removed it and it's working like a charm now. Is that "new" class is a typo, or it has a special meaning in there?

Thanks again for pointing me to the right direction!
0
Kate
Telerik team
answered on 16 Dec 2013, 02:22 PM
Hi İlter,

Thank you for the interest. Indeed as you noticed the .new css class does not really have a special purpose and it is rather a typo in the css class selector. What does make the difference is the .newClass  class.

Regards,
Kate
Telerik
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.
Tags
TreeView
Asked by
Ken Payson
Top achievements
Rank 1
Answers by
Shinu
Top achievements
Rank 2
İlter
Top achievements
Rank 1
Kate
Telerik team
Share this question
or