How to load single user control on selection of a tab in asp.net

Question

I got 15 tabs and 15 user controls assigned to each tab. All are loading at once which id delaying the process. I want to load one user control on selection of a tab in tab container.

Answer 1

Instead of adding all controls declaratively on the page, add them programmatically on the tab change event. See this link: http://msdn.microsoft.com/en-us/library/c0az2h86.aspx

Or here's the short version..

1. Change the Register declaration at the top of the page, to a reference:

   <%@ Reference Control="MyUserControl.ascx" %>

2. In your tab change event, load the the uc from file:

   Dim uc As MyUserControl = CType(LoadControl("MyUserControl.ascx"), MyUserControl)

3. Add the control to the page:

   PlaceHolder1.Controls.Add(uc)

Answer 2

Here's the complete solution. The markup...

<%@ Reference Control="~/MyUserControl.ascx" %>
<%@ Register assembly="AjaxControlToolkit" namespace="AjaxControlToolkit" tagprefix="asp" %>

<asp:TabContainer ID="TabContainer1" runat="server" AutoPostBack="true">
    <asp:TabPanel id="Tab1" runat="server">
        <HeaderTemplate>
            Tab1
        </HeaderTemplate>
        <ContentTemplate>
            Tab 1 static content
        </ContentTemplate>                
    </asp:TabPanel>
    <asp:TabPanel id="Tab2" runat="server">
        <HeaderTemplate>
            Tab2
        </HeaderTemplate>
        <ContentTemplate>
            <!-- user control will be loaded here -->
        </ContentTemplate>
    </asp:TabPanel>
</asp:TabContainer>

...and codebehind:

Protected Sub TabContainer1_ActiveTabChanged(ByVal sender As Object, ByVal e As System.EventArgs) Handles TabContainer1.ActiveTabChanged
    If TabContainer1.ActiveTabIndex = 1 Then
        Dim uc As MyUserControl = CType(LoadControl("MyUserControl.ascx"), MyUserControl)
        Tab2.Controls.Add(uc)
    End If
End Sub