Home / Community & Support / Knowledge Base / RadControls for ASP.NET and ASP.NET AJAX / Splitter / Load content on demand when expanding RadSlidingPane

Load content on demand when expanding RadSlidingPane

Article Info

Rating: Not rated

Article information

Article relates to

 RadSplitter for ASP.NET AJAX

Created by

 Svetlina, Telerik



HOW-TO : Load content on demand when expanding RadSlidingPane


SOLUTION:



The scenario of loading content on demand when a RadSlidingPane is expanded is useful in cases when the content slows down the performance and it is not needed to render additional HTML. In order to implement it, you can hook up the RadSlidingPane's OnClientExpanding event and perform an AJAX request which loads the content e.g as shown below:

aspx:

<form id="form1" runat="server">
       <asp:ScriptManager ID="ScriptManager1" runat="server" />
       <script type="text/javascript">
         
       function OnClientExpanding()
       
            if
(!sender._loaded)
            {
            $find("<%=RadAjaxPanel1.ClientID %>").ajaxRequest(); 
              sender._loaded = true;
           } 
          }
       </script>
       <telerik:RadSplitter ID="RadSplitter1" runat="server">
           <telerik:RadPane ID="RadPane1" runat="server" Width="22">
               <telerik:RadSlidingZone ID="RadSlidingZone1" runat="server">
                   <telerik:RadSlidingPane ID="RadSlidingPane1" runat="server" Title="LOD" OnClientExpanding="OnClientExpanding">
                       <telerik:RadAjaxPanel ID="RadAjaxPanel1" runat="server" OnAjaxRequest="OnAjaxRequest">
                       </telerik:RadAjaxPanel>
                   </telerik:RadSlidingPane>
               </telerik:RadSlidingZone>
           </telerik:RadPane>
           <telerik:RadPane ID="RadPane2" runat="server">
           </telerik:RadPane>
       </telerik:RadSplitter>
   </form>

code-behind:

protected void OnAjaxRequest(object sender, AjaxRequestEventArgs e)
{
    RadAjaxPanel1.Controls.Add(Page.LoadControl("~/WebUserControl.ascx"));
}

You can find a sample running demo attached to the article.

Comments

There are no comments yet.
If you'd like to comment on this KB article, please, send us a Support Ticket.
Thank you!

Please Sign In to rate this article.