Hi,
I have a WebTab control and add dynamically some tabs. Only first tab has content on initial stage, another tabs are empty. It is possible to load content on TabChanging with Ajax (without LoadOnDemandUrl and iframes) ?
Hi Viktor,
thank you for your answer. I don't need to add any Tabs on client side or using AJAX, all tabs are dynamically created (not in design mode) on first request. But they have no content, they are empty after first page load, besause the content of every tab is very heavy. What I need is a LoadOnDemand functionality, but without setting ContentURL and therefore IFrames.
LoadOnDemand=true works perfectly for tabs created in design mode, but i have no idea, no example how i can reach the same functionality for tabs created dynamically.
Hi pobo001,
Nikolay gave you an example to add tab on client, which content has url. If you are interested in explicit child controls in tab items created by server, then it is supported as well. However, in this case, if you expect persistance of viewstate and server events for your dynamic controls, then you should follow general asp.net rules (that is not related to WebTab, but to any container).Those rules are quite simple:1. Recreate exactly same controls in every single session (postback).2. Use exactly the same unique values for IDs of your child controls.
You may add new tab item on server (using any server event) or on client (using any client event).If you need to add new tabs and controls using AJAX, then you should wrap WebTab into UpdatePanel.Note: the Async option in AutoPostBackFlags can not be used, because it affects only WebTab by itself, but not templates/content of its tab items.
For simplicity, I wrote a sample, which adds new tabs on client using AddNewTabItem and fills those tabs by dynamic controls in 2 ways: UserControlUrl and explicit new controls. ViewStates of those dynamic controls will persist.
aspx:
<asp:UpdatePanel ID="UpdatePanel1" runat="server"> <ContentTemplate> <ig:WebTab ID="WebTab1" runat="server" Width="300px" Height="200px"> <Tabs> <ig:ContentTabItem runat="server" Text="Tab 1"> <Template> <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox> </Template> </ig:ContentTabItem> </Tabs> <AutoPostBackFlags SelectedIndexChanged="On" /> <AddNewTabItem Enabled="True"></AddNewTabItem> </ig:WebTab> </ContentTemplate></asp:UpdatePanel>
aspx.cs:
protected void Page_Load(object sender, EventArgs e){ int count = this.WebTab1.Tabs.Count; // skip 1st tab which was created in aspx while (count-- > 1) { ContentTabItem tab = this.WebTab1.Tabs[count]; if (count == 1) // note: that assignment can be used only once, because, UserControlUrl persists by itself tab.UserControlUrl = "WebUserControl1.ascx"; if (count == 2) { TextBox tb = new TextBox(); tb.ID = "TextBoxOn3rdTab"; tab.Controls.Add(tb); } // etc. }
}
If you have any further questions, please do not hesitate to ask.
Hello pobo001,
You could add new tab for example on button click, like this:
<asp:Button ID="Button1" Text="Add tab" runat="server" OnClientClick="addTab(); return false;" />
function addTab() { var webTab = $find("WebTab1"); webTab.addTab("Infragistics", "http://es.infragistics.com");}
Let me know if this helps.