Trouble with TabStrip with MultiPage using asp:panel to load controls dynamically.

[Joh]

I can't figure out how to get the postback form not making the controls hidden on posting.
Example code:

<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
<%@ Register TagPrefix="uc1" TagName="UserControl1" Src="~/Controls/UserControl1.ascx" %>
<%@ Register TagPrefix="uc2" TagName="UserControl2" Src="~/Controls/UserControl2.ascx" %>
<%@ Register TagPrefix="uc3" TagName="UserControl3" Src="~/Controls/UserControl3.ascx" %>
<%@ Register TagPrefix="uc4" TagName="UserControl4" Src="~/Controls/UserControl4.ascx" %>
................
................

       <telerik:RadAjaxManager runat="server" ID="RadAjaxManager1">
           <AjaxSettings>
               <telerik:AjaxSetting AjaxControlID="RadTabStrip1">
                   <UpdatedControls>
                       <telerik:AjaxUpdatedControl ControlID="RadTabStrip1" />
                       <telerik:AjaxUpdatedControl ControlID="RadMultiPage1" LoadingPanelID="LoadingPanel1" />
                   </UpdatedControls>
               </telerik:AjaxSetting>
               <telerik:AjaxSetting AjaxControlID="RadMultiPage1">
                   <UpdatedControls>
                       <telerik:AjaxUpdatedControl ControlID="RadMultiPage1" LoadingPanelID="LoadingPanel1" />
                   </UpdatedControls>
               </telerik:AjaxSetting>
           </AjaxSettings>
       </telerik:RadAjaxManager>
       <script type="text/javascript">
           function onTabSelecting(sender, args) {
               if (args.get_tab().get_pageViewID()) {
                   args.get_tab().set_postBack(false);
               }
           }
        </script>
        <telerik:RadTabStrip AutoPostBack="false" OnClientTabSelecting="onTabSelecting" ID="RadTabStrip1" SelectedIndex="0" runat="server"
        MultiPageID="RadMultiPage1" OnTabClick="RadTabStrip1_TabClick" Orientation="HorizontalTop" ScrollChildren="true" ScrollButtonsPosition="Middle"
        PerTabScrolling="true">
            <Tabs>
                <telerik:RadTab runat="server" Text="Class Schedule" Value="0">
                </telerik:RadTab>
                <telerik:RadTab runat="server" Text="Transfer Work" Value="1">
                </telerik:RadTab>
                <telerik:RadTab runat="server" Text="CLASS/GE" Value="2">
                </telerik:RadTab>
                <telerik:RadTab runat="server" Text="Academic History" Value="3">
                </telerik:RadTab>
            </Tabs>
        </telerik:RadTabStrip>
         <%--ID="RadTabStrip1" OnTabClick="RadTabStrip1_TabClick" SelectedIndex="0" runat="server" Orientation="HorizontalTop" Align="Right"
            AutoPostBack="false">--%>
       <%-- <telerik:RadMultiPage ID="RadMultiPage1" runat="server" SelectedIndex="0" OnPageViewCreated="RadMultiPage1_PageViewCreated"
        ScrollBars="Auto">--%>
         <telerik:RadMultiPage ID="RadMultiPage1" runat="server" SelectedIndex="0">
            <telerik:RadPageView ID="RadPageView1" runat="server">
                <%--<uc1:UserControl1 ID="ucUserControl1" runat="server" Visible="false"></uc1:UserControl1>--%>
                <asp:Panel ID="pn0UserControl3" runat="server"></asp:Panel>
            </telerik:RadPageView>
            <telerik:RadPageView ID="RadPageView2" runat="server">
                <%--<uc2:UserControl2 ID="ucUserControl2" runat="server" Visible="false"></uc2:UserControl2>--%>
                <asp:Panel ID="pn1UserControl2" runat="server"></asp:Panel>
            </telerik:RadPageView>
            <telerik:RadPageView ID="RadPageView3" runat="server">
                <%--<uc3:UserControl3 ID="ucUserControl3" runat="server" Visible="false"></uc3:UserControl3>--%>
                <asp:Panel ID="pn2UserControl1" runat="server"></asp:Panel>
            </telerik:RadPageView>
            <telerik:RadPageView ID="RadPageView4" runat="server">
                <%--<uc4:UserControl4 ID="ucUserControl4" runat="server" Visible="false"></uc4:UserControl4>--%>
                <asp:Panel ID="pn3UserControl4" runat="server"></asp:Panel>
            </telerik:RadPageView>
        </telerik:RadMultiPage>

        <telerik:RadAjaxLoadingPanel runat="server" ID="LoadingPanel1">
        </telerik:RadAjaxLoadingPanel>
...........................................
..........................................

Control ctrl0, ctrl1, ctrl2, ctrl3;

    protected void RadTabStrip1_TabClick(object sender, RadTabStripEventArgs e)
    {
        switch (e.Tab.Index)
        {
            case 0:
                ctrl0 = Page.LoadControl("~/Controls/UserControl1.ascx");
                pn1UserControl2 = RadMultiPage1.FindControl("pn1UserControl2") as Panel;
                pn1UserControl2.Controls.Clear();

                pn2UserControl3 = RadMultiPage1.FindControl("pn2UserControl3") as Panel;
                pn2UserControl3.Controls.Clear();

                pn3UserControl4 = RadMultiPage1.FindControl("pn3UserControl4") as Panel;
                pn3UserControl4.Controls.Clear();

                pn0UserControl1 = RadMultiPage1.FindControl("pn0UserControl1") as Panel;
                pn0UserControl1.Controls.Add(ctrl0);

                break;

            case 1:
                ctrl1 = Page.LoadControl("~/Controls/UserControl2.ascx");

                pn0UserControl1 = RadMultiPage1.FindControl("pn0UserControl1") as Panel;
                pn0UserControl1.Controls.Clear();

                pn2UserControl3 = RadMultiPage1.FindControl("pn2UserControl3") as Panel;
                pn2UserControl3.Controls.Clear();

                pn3UserControl4 = RadMultiPage1.FindControl("pn3UserControl4") as Panel;
                pn3UserControl4.Controls.Clear();

                pn1UserControl2 = RadMultiPage1.FindControl("pn1UserControl2") as Panel;
                pn1UserControl2.Controls.Add(ctrl1);

                break;

            case 2:
                ctrl2 = Page.LoadControl("~/Controls/UserControl3.ascx");

                pn0UserControl1 = RadMultiPage1.FindControl("pn0UserControl1") as Panel;
                pn0UserControl1.Controls.Clear();

                pn1UserControl2 = RadMultiPage1.FindControl("pn1UserControl2") as Panel;
                pn1UserControl2.Controls.Clear();

                pn3UserControl4 = RadMultiPage1.FindControl("pn3UserControl4") as Panel;
                pn3UserControl4.Controls.Clear();

                pn2UserControl3 = RadMultiPage1.FindControl("pn2UserControl3") as Panel;
                pn2UserControl3.Controls.Add(ctrl2);

                break;

            case 3:
                ctrl3 = Page.LoadControl("~/Controls/UserControl4.ascx");

                pn0UserControl1 = RadMultiPage1.FindControl("pn0UserControl1") as Panel;
                pn0UserControl1.Controls.Clear();

                pn1UserControl2 = RadMultiPage1.FindControl("pn1UserControl2") as Panel;
                pn1UserControl2.Controls.Clear();

                pn2UserControl3 = RadMultiPage1.FindControl("pn2UserControl3") as Panel;
                pn2UserControl3.Controls.Clear();

                pn3UserControl4 = RadMultiPage1.FindControl("pn3UserControl4") as Panel;
                pn2UserControl3.Controls.Add(ctrl3);

                break;
        }

The controls consists of RadListView, grids etc.  I even tried the Demo
Can't seem to figure this out... The other Demo doesn't use RadTabStrip and wanted these dynamic complex controls to work.  Else I will have to split these to different pages.

[Rory]

Hi I am not sure of your scenario but when I load tab controls dynamically I use this code below and everything works fine.

RadTab tab = new RadTab();

tab.Text = TitleText;

tab.Height = System.Web.UI.WebControls.Unit.Pixel(25);

tab.Value = newTabValue;

RadTabStrip1.Tabs.Insert(1, tab);

RadPageView pageView = new RadPageView();

pageView.ID = newTabValue;

pageView.Height = Unit.Percentage(100);

RadMultiPage1.PageViews.Insert(1, pageView); 

tab.Selected = true;

pageView.Selected = true;                   
pageView.Selected = true;

Then I catch the Create Event for the pageview and assign the UserControl.

void RadMultiPage1_PageViewCreated(object sender, RadMultiPageEventArgs e)
{
    try
    {
        if (e.PageView.ID.IndexOf("Compose") > -1)
        {
            //ID looks like Compose_0 and its always 0
            string userControlName = "Controls/MailSender.ascx";
            Systema.Sims.Web.Claims.Controls.MailSender userControl = Page.LoadControl(userControlName) as Systema.Sims.Web.Claims.Controls.MailSender;
            userControl.ID = e.PageView.ID + "_userControl";
            userControl.MailID = 0;
            e.PageView.Controls.Add(userControl);
        }
        else if (e.PageView.ID.IndexOf("Read") > -1)
        {
            //ID looks like Read_101
            string strID = e.PageView.ID;
            strID = strID.Substring(strID.IndexOf("_") + 1);
            int id = Convert.ToInt32(strID);
            string userControlName = "Controls/MailReader.ascx";
            Systema.Sims.Web.Claims.Controls.MailReader userControl = Page.LoadControl(userControlName) as Systema.Sims.Web.Claims.Controls.MailReader;
            userControl.ID = e.PageView.ID + "_userControl";
            userControl.MailID = id;
            e.PageView.Controls.Add(userControl);
        }
      }
    catch (Exception ex)
    {
        Hashtable errData = new Hashtable();
        errData["e.PageView.ID"] = e.PageView.ID;
        string err = SimsException.FormatErrorMessage("Error creating new page view.", errData);
        Exception ex2 = new Exception(err, ex);
        SimsException.ProcessException(ex2, ref lblMessages);
    }
}

Here is where I declared the Tab and MultiPage. I also make sure the TabStrip and Multipage are wrapped in an Ajaxified <DIV>.
Good Luck!

<telerik:RadTabStrip 

  ID="RadTabStrip1"

  runat="server"

  MultiPageID="RadMultiPage1"

  ClickSelectedTab="false"

  EnableTheming="false"

  EnableEmbeddedSkins="True"

  Skin="WebBlue"

  width="100%"

  SelectedIndex="0"

  Font-Size="12px"

  ScrollButtonsPosition="Right"

  ScrollChildren="true"

  CausesValidation="false"

  Height="25px"

  AutoPostBack="false">

<Tabs>

<telerik:RadTab runat="server" Font-Size="12px"  Font-Bold="true"

    AccessKey="I" Text=" Inbox" Value="Inbox_0">

</telerik:RadTab>

</Tabs>

</telerik:RadTabStrip>

<telerik:RadMultiPage ID="RadMultiPage1" CssClass="MultiPage" runat="server" SelectedIndex="0" Width="100%" Height="100%"> 

    <

 

 

telerik:RadPageView ID="pvInbox" runat="server">

 

    ...Default Page View is a Grid not a UserControl.
    </

 

 

telerik:RadPageView>

 

</telerik:RadMultiPage>

[Joh]

I got a different method to work, I had to do this a bit differently since the other tabs actually allow data to be entered/manipulated so we have to clear out the old control:

private const string BASE_CTRL = "~/Controls/";

protected void Page_Load(object sender, EventArgs e)
    {
            if (!Page.IsPostBack)
            {
                string controlPath = BASE_CTRL + "UserControl1.ascx";
                LastLoadedControl = controlPath;
            }
            LoadUserControl();
    }

private void LoadUserControl()
{
    string controlPath = LastLoadedControl;

    if (!string.IsNullOrEmpty(controlPath))
    {
        PlaceHolder1.Controls.Clear();
        UserControl uc = (UserControl)LoadControl(controlPath);
        PlaceHolder1.Controls.Add(uc);
    }
}

 private string LastLoadedControl
{
    get
    {
        return ViewState["LastLoaded"] as string;
    }
    set
    {
        ViewState["LastLoaded"] = value;
    }
}

protected void RadTabStrip1_TabClick(object sender, RadTabStripEventArgs e)
    {
        string controlPath = string.Empty;

        switch (e.Tab.Index)
        {
            case 0:
                controlPath = BASE_CTRL + "UserControl1.ascx";
                break;

            case 1:
                controlPath = BASE_CTRL + "UserControl2.ascx";
                break;

            case 2:
                controlPath = BASE_CTRL + "UserControl3.ascx";
                break;

            case 3:
                controlPath = BASE_CTRL + "UserControl4.ascx";
                break;
        }
        LastLoadedControl = controlPath;
        LoadUserControl();
    }

And I modified the View to be:

<telerik:RadAjaxManager runat="server" ID="RadAjaxManager1">
    <AjaxSettings>
        <telerik:AjaxSetting AjaxControlID="RadTabStrip1">
            <UpdatedControls>
                <telerik:AjaxUpdatedControl ControlID="RadTabStrip1" />
                <telerik:AjaxUpdatedControl ControlID="RadMultiPage1" LoadingPanelID="LoadingPanel1" />
            </UpdatedControls>
        </telerik:AjaxSetting>
        <telerik:AjaxSetting AjaxControlID="RadMultiPage1">
            <UpdatedControls>
                <telerik:AjaxUpdatedControl ControlID="RadMultiPage1" LoadingPanelID="LoadingPanel1" />
            </UpdatedControls>
        </telerik:AjaxSetting>
    </AjaxSettings>
</telerik:RadAjaxManager>
<telerik:RadTabStrip ID="RadTabStrip1" SelectedIndex="0" runat="server" MultiPageID="RadMultiPage1"
    OnTabClick="RadTabStrip1_TabClick" Orientation="HorizontalTop" ScrollChildren="true"
    ScrollButtonsPosition="Middle" PerTabScrolling="true" ClickSelectedTab="true">
    <Tabs>
        <telerik:RadTab runat="server" Text="UserControl1" Value="0">
        </telerik:RadTab>
        <telerik:RadTab runat="server" Text="UserControl2" Value="1">
        </telerik:RadTab>
        <telerik:RadTab runat="server" Text="UserControl3" Value="2">
        </telerik:RadTab>
        <telerik:RadTab runat="server" Text="UserControl4" Value="3">
        </telerik:RadTab>
    </Tabs>
</telerik:RadTabStrip>
<telerik:RadMultiPage ID="RadMultiPage1" runat="server" SelectedIndex="0" RenderSelectedPageOnly="True">
    <telerik:RadPageView ID="rpvPlaceHolder1" runat="server">
        <asp:PlaceHolder ID="PlaceHolder1" runat="server"></asp:PlaceHolder>
    </telerik:RadPageView>
</telerik:RadMultiPage>
<telerik:RadAjaxLoadingPanel runat="server" ID="LoadingPanel1">
</telerik:RadAjaxLoadingPanel>