AJAX TreeList - New Q2 2011 Features

I want to introduce you two new cool features in the RadTreeList for ASP.NET AJAX, available into the Q2 2011 release.

RadTreeList Scrolling

Sometimes you need to load dozens of rows into the RadTreeList, however the space where the RadTreeList control is placed on the page is not so big and the entire layout of the page is messed up. In this case you may feel some discomfort with necessity of scrolling. So here it is, you could use it when the page has limitations regarding the size of the RadTreeList control. To enable the scrolling of the RadTreeList you need to set the ClientSettings.Scrolling.AllowScroll property to true.

<telerik:RadTreeList ID="RadTreeList2" runat="server" ... >
    <ClientSettings>
        <Scrolling AllowScroll="true" />
    </ClientSettings>
</telerik:RadTreeList>

In this scenario when user scrolls to the bottom the headers are not visible. In some scenarios this is unacceptable, however the Scrolling has a UseStaticHeader property, just set it to true and the RadTreeList will keep the headers at the top and they will always be visible :

<telerik:RadTreeList ID="RadTreeList2" runat="server" ...>
  <ClientSettings>
       <Scrolling AllowScroll="true" UseStaticHeaders="true" />
  </ClientSettings>
</telerik:RadTreeList>

The RadTreeList scrolling offers another useful property - SaveScrollPosition. It indicates whether the RadTreeList will keep its scroll position during postbacks.

<telerik:RadTreeList ID="RadTreeList2" runat="server" ...>
   <ClientSettings>
       <Scrolling AllowScroll="true" SaveScrollPosition="true" />
   </ClientSettings>
</telerik:RadTreeList>

You could see a live demo of RadTreeList scrolling on this link.

RadTreeList Load-on-Demand

Since the Q2 2011 release RadTreeList supports a new Load-on-Demand functionality. With load on demand only the root items will be loaded initially and the child items will be added on the fly as parent nodes are expanded. In this case the items should be loaded only when they are needed and the paging will be applied to the subset of the all rows. To use load on demand in the RadTreeList you need to perform the following steps:

• Set AllowLoadOnDemand property to true
• Get only the root items from the datasource and bind the RadTreeList to them into RadTreeList.NeedDataSource event handler:
  C#

  protected void RadTreeList1_NeedDataSource(object sender,
      TreeListNeedDataSourceEventArgs e)
  {
      RadTreeList1.DataSource = GetDataTable("SELECT * FROM" + 
      "TestItems WHERE ParentID IS NULL", null);
  } 
  

  
  VB

  Protected Sub RadTreeList1_NeedDataSource(ByVal sender As Object,
                      ByVal e As TreeListNeedDataSourceEventArgs)
          RadTreeList1.DataSource = GetDataTable("SELECT * FROM" &
          "TestItems WHERE ParentID IS NULL", Nothing)
  End Sub
  

• Handle the RadTreeList.ChildItemsDataBind event and select the subset of items related to the expanded item and assign them to the e.ChildItemsDataSource into the RadTreeList.ChildItemsDataBind event handler:
  C#

  protected void RadTreeList1_ChildItemsDataBind(object sender,
      TreeListChildItemsDataBindEventArgs e)
  {
      int id = Convert.ToInt32(e.ParentDataKeyValues["ID"].ToString());
      e.ChildItemsDataSource = GetDataTable("SELECT *" + 
          " FROM TestItems WHERE ParentID = " + id);
  }
  

  
  VB

  Protected Sub RadTreeList1_ChildItemsDataBind(ByVal sender As Object,
           ByVal e As TreeListChildItemsDataBindEventArgs)
          Dim id As Integer =
              Convert.ToInt32(e.ParentDataKeyValues("ID").ToString())
          e.ChildItemsDataSource = GetDataTable("SELECT *" &
        " FROM TestItems WHERE ParentID = " & id)
  End Sub
  

Live example of RadTreeList Load-on-Demand you could see here.