This is how my dynamic tab panel is implemented:
testuctabs.aspx
<%@ Page Language="C#" AutoEventWireup="true" %>
<%@ Register Src="~/testuctab.ascx" TagName="TestTab" TagPrefix="cstm" %>
<!DOCTYPE html>
<script runat="server">
private class TestucTab
{
public testuctab_ascx Testuc { get; set; }
public FormPanel Tab { get; set; }
}
private List<Guid> CurrentTabIDs
{
get { return !string.IsNullOrWhiteSpace(hidCurrTabIDs.Text) ? JSON.Deserialize<List<Guid>>(hidCurrTabIDs.Text) : new List<Guid>(); }
set { hidCurrTabIDs.Text = JSON.Serialize(value); }
}
protected void Page_Load(object sender, EventArgs e)
{
CurrentTabIDs.ForEach(x => CreateTabControls(x));
}
private TestucTab CreateTabControls(Guid tabID)
{
FormPanel tab = new FormPanel();
tab.Layout = "FormLayout";
string cID = string.Format("tab{0:N}", tabID);
tab.ID = cID;
tab.Title = cID;
tp.Items.Add(tab);
testuctab_ascx testuc = (testuctab_ascx)this.LoadControl(@"~/testuctab.ascx");
testuc.ID = string.Format("testuc{0:N}", tabID);
tab.ContentControls.Add(testuc);
return new TestucTab() { Testuc = testuc, Tab = tab };
}
private void CreateTab()
{
Guid newtabID = Guid.NewGuid();
List<Guid> tabIDs = CurrentTabIDs;
tabIDs.Add(newtabID);
CurrentTabIDs = tabIDs;
TestucTab testucTab = CreateTabControls(newtabID);
X.ControlsScripting = false;
testucTab.Testuc.initStuff("Setting this from parent");
X.ControlsScripting = true;
testucTab.Tab.Render();
tp.SetActiveTab(testucTab.Tab);
}
protected void btnLoadControl_DirectClick(object sender, DirectEventArgs e)
{
CreateTab();
}
</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title>UserControl Loading Test</title>
</head>
<body>
<form id="frm" runat="server">
<ext:ResourceManager ID="rsMan" runat="server" />
<ext:Button ID="btnLoadControl" runat="server" OnDirectClick="btnLoadControl_DirectClick" Text="Create Tab" />
<ext:TabPanel ID="tp" runat="server" Layout="FitLayout" />
<ext:Hidden ID="hidCurrTabIDs" runat="server" />
</form>
</body>
</html>
testuctab.ascx
<%@ Control Language="C#" AutoEventWireup="true" %>
<script runat="server">
public class State
{
public string StateID { get; set; }
public string StateName { get; set; }
}
public void initStuff(string text)
{
lbl.Text = text;
strStateList.DataSource = new List<State>()
{
new State(){ StateID = "AK", StateName="ALASKA" },
new State(){ StateID = "AL", StateName="ALABAMA" },
new State(){ StateID = "AR", StateName="ARKANSAS" }
};
}
protected void btn_DirectClick(object sender, DirectEventArgs e)
{
lbl.Text = DateTime.Now.ToString();
cmbState.Value = "AL";
}
</script>
<ext:FormPanel runat="server" Layout="FormLayout" Height="200">
<Items>
<ext:Label runat="server" ID="lbl" />
<ext:ComboBox runat="server" ID="cmbState" DisplayField="StateName" ValueField="StateID">
<Store>
<ext:Store ID="strStateList" runat="server">
<Reader>
<ext:JsonReader />
</Reader>
<Model>
<ext:Model ID="mdlStateList" runat="server" IDProperty="StateID">
<Fields>
<ext:ModelField Name="StateID" />
<ext:ModelField Name="StateName" />
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
</ext:ComboBox>
<ext:Button ID="btn" runat="server" Text="Do Stuff" OnDirectClick="btn_DirectClick" />
</Items>
</ext:FormPanel>