Home / Community & Support / Developer Productivity Tools Forums / ASP.NET AJAX > TreeView > How To Set TreeView Max Levels

• Jordan

  Posted on Feb 7, 2012 (permalink)

  I would like to know if there is a way to set a maximum number of levels to render when binding to a datasource?
  
  We are using radtreeview with Sharepoint 2007 like this:
  

  <asp:ContentPlaceHolder ID="PlaceHolderVerticalNav" runat="server">

      <telerik:RadTreeView Runat="server" id="RadTreeView1"  datasourceid="topSiteMap" EnableEmbeddedBaseStylesheet="false" EnableEmbeddedSkins="false"></telerik:RadTreeView>

      <PublishingNavigation:PortalSiteMapDataSource ID="topSiteMap" Runat="server" SiteMapProvider="CombinedNavSiteMapProvider"

  EnableViewState="true" StartFromCurrentNode="false" StartingNodeOffset="0" ShowStartingNode="false"/>

  </asp:ContentPlaceHolder>

  
  Our datasource has 10 levels deep, but I want to restrict it to displaying just the first 3 levels.  
  
  Any tips would be helpful.
  

  Reply

• Jordan

  Posted on Feb 7, 2012 (permalink)

  I figured out the primary part of my problem... by adding MaxDataBindDepth="3" to the treeview tag, I was able to restrict the menu to 3 levels deep.
  
  Now the next part of the problem is... If I am on a page that is at level 4, I would like for the parent page at level 3 to display as expanded and selected.
  
  Once again, any tips would be helpful.  Thank you.

  Reply


• Princy MVP

  Posted on Feb 8, 2012 (permalink)

  Hello,
  
  Try the following javascript.
  JS:
  

  <script type="text/javascript">

   function OnClientNodeExpanding(sender, args)

    {

       if (args.get_node().get_level() == 2)

         {

             args.get_node().set_selected(true);

         }

    }

  </script>

  
  Thanks,
  Princy.

  Reply

• Jordan

  Posted on Feb 8, 2012 (permalink)

  Thanks for the info, I will give that shot.  For now I'm using css and jquery.  I set the radtreeview to display 4 levels deep with MaxDataBindDepth="4", then I hide the 4th level with CSS, then used jquery assign the parent as selected.  And it seems to work for our scenario.
  
  CSS
  

  #navList ul ul ul ul {

      display:none;

  }

  
  jQuery
  

  $("#navList ul ul ul ul li div.rtSelected").parent().parent().siblings("div").addClass("rtSelected");

  Reply

Back to Top

Home / Community & Support / Developer Productivity Tools Forums / ASP.NET AJAX > TreeView > How To Set TreeView Max Levels