+1-888-365-2779
Try Now
More in this section

Forums / Developing with Sitefinity / SiteTreeView - Expanding all nodes

SiteTreeView - Expanding all nodes

18 posts, 0 answered
  1. Nicko
    Nicko avatar
    16 posts
    Registered:
    10 Mar 2008
    09 Jul 2008
    Link to this post
    Hi,

    What property can I set for the SiteTreeView to expand all nodes, or the next level of nodes when the page is loaded/viewed.

    Cheers

    Nicko
  2. Pepi
    Pepi avatar
    981 posts
    Registered:
    28 Oct 2016
    09 Jul 2008
    Link to this post
    Hi Nicko,

    I would recommend you make a copy of Sitefinity SiteTreeview control (~/Sitefinity/UserControls/Navigation/SiteTreeview.ascx) and modify it according to your requirements. Here is a simple example of how to
    expand all treeview nodes on load:

    .ascx
    ... 
     
    <script language="javascript" type="text/javascript">  
                
        function treeExpandAllNodes()       
        {          
            var i;         
            var treeviewInstance = <%= RadTreeview1.ClientID %>;     
                       
            for (i=0; i < treeviewInstance.AllNodes.length; i++)           
            {            
                if (treeviewInstance.AllNodes[i].Nodes != null)              
                {              
                    treeviewInstance.AllNodes[i].Expand();           
                }          
            }       
        }               
             
        window.onload = treeExpandAllNodes;  
             
    </script>  
     
     
    <asp:SiteMapDataSource ID="SitemapDataSource1" runat="server" ShowStartingNode="false" /> 
    <radTV:RadTreeview ID="RadTreeview1" runat="server" OnNodeBound="RadTreeview1_NodeBound" DataSourceID="SitemapDataSource1"
    </radTV:RadTreeview> 

    Hope this helps.

    Sincerely yours,
    Pepi
    the Telerik team

    Instantly find answers to your questions at the new Telerik Support Center
  3. Daniel Plomp
    Daniel Plomp avatar
    952 posts
    Registered:
    18 Feb 2004
    09 Jul 2008
    Link to this post
    Hi Nicko,

    You should go to the code-behind of this usercontrol:
    ~/Sitefinity/UserControls/Navigation/SiteTreeview.ascx or edit the ~/Sitefinity/UserControls/Navigation/SiteTreeview.ascx.cs directly.

    Change the RadTreeview1_NodeBound method as follows to expand all the nodes of the RadTreeView:

    public void RadTreeview1_NodeBound(object o, RadTreeNodeEventArgs e)  
        {  
            CmsSiteMapNode node2 = SiteMap.CurrentNode as CmsSiteMapNode;  
            if (node2 != null && node2.ParentNode != null)  
            {  
                while (node2.ParentNode != SiteMap.RootNode)  
                {  
                    RadTreeNode item2 = this.RadTreeview1.FindNodeByUrl(this.ResolveUrl(node2.Url));  
                    if (item2 != null)  
                        item2.Selected = true;  
                    node2 = node2.ParentNode as CmsSiteMapNode;  
                }  
                RadTreeNode item = this.RadTreeview1.FindNodeByUrl(this.ResolveUrl(node2.Url));  
                if (item != null)  
                {  
                    // here you can set the style for the top-level item     
                    item.Selected = true;  
                }   
                item.Expanded = true;  
            }   
        } 

    So, that will expand all nodes.

    Daniel
  4. Daniel Plomp
    Daniel Plomp avatar
    952 posts
    Registered:
    18 Feb 2004
    09 Jul 2008
    Link to this post
    Okay, I was too late. Learned something new now. :)

    Greetings,
    Daniel
  5. Joe Burke
    Joe Burke avatar
    3 posts
    Registered:
    01 Apr 2008
    28 Feb 2009
    Link to this post
    I have tried both of these methods and niether is working on 3.5

    Can someone explain how to have all nodes visible in treeview when page loads.

    Thanks
  6. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    25 Nov 2016
    01 Mar 2009
    Link to this post
    <%@ Control Language="C#" AutoEventWireup="true" CodeFile="SiteTreeview.ascx.cs" Inherits="UserControls_SitemapTreeview" %> 
    <%@ Register TagPrefix="telerik" Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" %> 
     
     
    <script language="javascript" type="text/javascript">         
       function treeExpandAllNodes()  
       {  
           var treeView = $find("<%= RadTreeview1.ClientID %>");  
           var nodes = treeView.get_allNodes();  
             
           for (var i=0; i < nodes.length; i++)  
           {  
               if (nodes[i].get_nodes() != null)  
               {  
                   nodes[i].expand();  
               }  
           }  
       }  
       window.onload = treeExpandAllNodes;  
       </script> 
     
     
    <asp:SiteMapDataSource ID="SitemapDataSource1" runat="server" ShowStartingNode="false" /> 
    <telerik:RadTreeview ID="RadTreeview1" runat="server" OnNodeBound="RadTreeview1_NodeBound" DataSourceID="SitemapDataSource1">  
    </telerik:RadTreeview> 
    Hello Christopher Hrica,

    Please try the code below.



    Greetings,
    Ivan Dimitrov
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Check out the tips for optimizing your support resource searches.
  7. Joe Burke
    Joe Burke avatar
    3 posts
    Registered:
    01 Apr 2008
    02 Mar 2009
    Link to this post
    Thanks - that did the trick
  8. Joe Burke
    Joe Burke avatar
    3 posts
    Registered:
    01 Apr 2008
    03 Mar 2009
    Link to this post
    Sorry - I spoke too soon.

    IE 7 is throwing the following error:

    'null' is null or not an object
  9. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    25 Nov 2016
    04 Mar 2009
    Link to this post
    Hi Christopher Hrica,

    Please remove window.onload = treeExpandAllNodes; from the javascript and use the function OnClientLoad in the RadTreeview declaration:

    <script language="javascript" type="text/javascript">          
       function treeExpandAllNodes()   
       {   
           var treeView = $find("<%= RadTreeview1.ClientID %>");   
           var nodes = treeView.get_allNodes();   
              
           for (var i=0; i < nodes.length; i++)   
           {   
               if (nodes[i].get_nodes() != null)   
               {   
                   nodes[i].expand();   
               }   
           }   
       }   
       </script>  
        
    <asp:SiteMapDataSource ID="SitemapDataSource1" runat="server" ShowStartingNode="false" /> 
    <telerik:RadTreeview  OnClientLoad="treeExpandAllNodes" EnableEmbeddedSkins="false" ID="RadTreeview1" runat="server" OnNodeBound="RadTreeview1_NodeBound" DataSourceID="SitemapDataSource1"
    </telerik:RadTreeview> 


    I hope this helps.

    Sincerely yours,
    Ivan Dimitrov
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Check out the tips for optimizing your support resource searches.
  10. Shirley
    Shirley avatar
    2 posts
    Registered:
    15 May 2009
    16 May 2009
    Link to this post
    Hi Ivan,

    I have followed the exact steps you have mentioned in your post...and the java script works fine...However I OnClientLoad() is never raised by the control....

    Should I register this event using code somewhere? I am kind of lost with this...Your help will be highly appreciated...By the way I am using Telerik Web.UI version 2008.1.619.35...

    Look forward to hear from you...

    Regards,
    Shirley.
  11. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    25 Nov 2016
    16 May 2009
    Link to this post
    Hi Shirley,

    If onClientLoad is not fired the the js function will not be called. I am sending you a screenshot represents that the events fires correctly. It is tested with the last version of Sitefinity - 3.6 1927 ,Telerik.Web.UI Q1
    You can test with the server side method  ExpandAllNodes() , but your nodes should have  ExpandMode set to ClientSide

    Kind regards,
    Ivan Dimitrov
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Check out the tips for optimizing your support resource searches.
  12. Shirley
    Shirley avatar
    2 posts
    Registered:
    15 May 2009
    16 May 2009
    Link to this post
    Hi Ivan,

    I want to use RadTreeView control with SharePoint PortalSiteMapDataSource and  display all the nodes in expanded mode. Here is the sample code I have used in the SharePoint page layout:

     
                <script type="text/javascript" language="javascript"
            function onLoad(sender) 
            { 
                alert('Sucess'); 
               var treeView = $find("<%= RadTreeAjax.ClientID %>");           
               var nodes = treeView.get_allNodes(); 
               for (var i=0; i < nodes.length; i++) 
               { 
                if (nodes[i].get_nodes() != null) 
                { 
                    nodes[i].expand(); 
                } 
               }  
            }    
             
                </script> 
             
            <%--<noindex>--%> 
                <PublishingNavigation:PortalSiteMapDataSource  
                ID="siteMapDataSource"  
                Runat="server" 
                SiteMapProvider="CombinedNavSiteMapProvider"  
                EnableViewState="true" 
                StartFromCurrentNode="false"  
                StartingNodeOffset="0"  
                ShowStartingNode="false" 
                TreatStartingNodeAsCurrent="false"           
                TrimNonCurrentTypes="Heading" /> 
         
                <telerik:RadTreeView ID="RadTreeAjax"   
                runat="server"  
                DataSourceID="siteMapDataSource"   
                Flow="Vertical"      
                OnClientLoad="OnLoad" 
                ExpandDirection="Down">          
                </telerik:RadTreeView> 
     

    OnClientLoad() never gets fired. So I decided to test this with a very simple ASP.Net web page:

    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="RadTreeView.aspx.cs" Inherits="AdvertWeb.RadTreeView" %> 
     
    <%@ Register assembly="Telerik.Web.UI, Version=2008.1.619.35, Culture=neutral, PublicKeyToken=121fae78165ba3d4" namespace="Telerik.Web.UI" tagprefix="telerik" %> 
    <%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %> 
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
     
    <html xmlns="http://www.w3.org/1999/xhtml" > 
    <head runat="server"
        <title>Untitled Page</title> 
        
    </head> 
    <body onload=""
     <script language="javascript" type="text/javascript"
            function expandTreeNodes() 
            { 
               var treeView = $find("<%= RadTreeView1.ClientID %>"); 
               alert(treeView); 
               var nodes = treeView.get_allNodes(); 
               for (var i=0; i < nodes.length; i++) 
               { 
                if (nodes[i].get_nodes() != null) 
                { 
                    nodes[i].expand(); 
                } 
               }  
            } 
        </script> 
        <form id="form1" runat="server"
        <telerik:RadScriptManager ID="RadScriptManager1" runat="server"
        </telerik:RadScriptManager> 
         
        <div> 
         
        </div> 
        <telerik:RadTreeView ID="RadTreeView1" Runat="server" onClientLoad="expandTreeNodes()"
            <Nodes> 
                <telerik:RadTreeNode runat="server" Text="Root RadTreeNode1"
                </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> 
                <telerik:RadTreeNode runat="server" Text="Root RadTreeNode3"
                    <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>    
        <href="javascript: expandTreeNodes();">Expand All</a>       
        </form> 
    </body> 
    </html> 
     

    Again the OnCientLoad() never gets fired. To test the javascript function (expandTreeNodes) I included a hyperlink "Expand All". On selecting the hyperlink the javascript code gets executed.

    My Questian: Why is the event not working? What is that I am missing? And also, you have suggested going to server side code with the ExpandMode set to ClientSide. Since I am using PortalSiteMapDataSource to dynamically generate the nodes I cannot specify this property to individual nodes as well.

    Your help is highly appreciated.

    Thanks,
    Shirley.

  13. Nikolai
    Nikolai avatar
    216 posts
    Registered:
    21 Nov 2016
    18 May 2009
    Link to this post
    Hello Shirley,

    The problem is with onClientLoad="expandTreeNodes()" it should be just onClientLoad="expandTreeNodes" .
    About you other question there is no problem with expanding the TreeView Nodes on the Client-Side, I have attached a simple .aspx page to this ticket in which this is done.

    Hope this helps.

    Regards,
    Nikolai
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Check out the tips for optimizing your support resource searches.
  14. SelAromDotNet
    SelAromDotNet avatar
    912 posts
    Registered:
    18 Jul 2012
    16 Apr 2010
    Link to this post
    is there a way to do this on the server side? expanding nodes on the client is clumsy and I don't like it :(
  15. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    25 Nov 2016
    19 Apr 2010
    Link to this post
    Hi SelArom,

    You can do it on the server - OnPreRender

    protected override void OnPreRender(EventArgs e)
       {
           base.OnPreRender(e);
           RadTreeview1.DataBind();
           foreach (RadTreeNode node in RadTreeview1.GetAllNodes())
           {
               node.Expanded = true;
           }
       }


    Kind regards,
    Ivan Dimitrov
    the Telerik team

    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
  16. Rich
    Rich avatar
    27 posts
    Registered:
    20 Feb 2010
    04 Sep 2010
    Link to this post
    The code behind technique worked well, but I'd like to have the code outside the standard Sitefinity folder so I don't run it over on upgrades.  I do that with other controls, but don't seem to see where to do it for the Site Treeview.

    Is there a parameter I can set to tell the Site TreeView to get it's ASCX and ASCX.CS from a ~/CustomTemplates/SiteTreeView folder?

    Thanks,
    Rich Winslow
    Automated Results Computer Consulting
    Brevard, NC
  17. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    25 Nov 2016
    05 Sep 2010
    Link to this post
    Hello Rich Winslow,

    The SiteMenu control is registered inside <toolboxControls> section of the website's web.config. From there you can change control's location and where the application will look for it.

    All the best,
    Ivan Dimitrov
    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  18. Shivers999
    Shivers999 avatar
    5 posts
    Registered:
    17 Feb 2010
    14 Oct 2011
    Link to this post
    Here's another very quick and easy answer. (I'm using SF 3.7 SP4)

    ~/Sitefinity/UserControls/Navigation35/SiteTreeview.ascx
    <asp:SiteMapDataSource ID="SitemapDataSource1" runat="server" ShowStartingNode="false" />
    <telerik:RadTreeView ID="RadTreeview1" runat="server" OnNodeDataBound="RadTreeview1_NodeBound" DataSourceID="SitemapDataSource1"
     
    OnDataBound="RadTreeview1_Expand"
     
    >
    </telerik:RadTreeView>


    ~/Sitefinity/UserControls/Navigation35/SiteTreeview.ascx
    protected void RadTreeview1_Expand(object sender, EventArgs e)
        {
            RadTreeview1.ExpandAllNodes();
        }
Register for webinar
18 posts, 0 answered