TabContainer inside UpdatePanel

I went through the forum to about 15 pages back and saw this issue come up in some way or another quite a few times but never fully resolved.

Basically I have the following:

<asp:UpdatePanel ChildrenAsTriggers="true" runat="server" ID="dataEdit" UpdateMode="Always">

<ContentTemplate>

<ajaxToolkit:TabContainer ID="tabEdit" runat="server" Visible="false">

<ajaxToolkit:TabPanel runat="server" HeaderText="tab one">

<ContentTemplate> <!-- some standard controls --> </ContentTemplate>

</ajaxToolkit:TabPanel>

</ajaxToolkit:TabContainer>

</ContentTemplate>

</asp:UpdatePanel>

Note that the TabContainer starts out with Visible="false". The idea is that this section is invisible until the user selects from a list, at which point the tabs become visible and the list becomes Enabled="false". Without the UpdatePanel encapsulating the TabContainer, everything works as desired (except for the full page refresh of course). But with the UpdatePanel, the TabContainer (while still functioning) is rendered with no styles. It appears in plain-text as:

Tab OneTab TwoTab Three

< contents >

With no borders and seemingly no way to restyle it. It is rendered correctly if the TabContainer starts out with Visible="true".

Any help would be appreciated. Thanks.

Hi,

Please note that if a server control's visible is set to false, this control won't be rendered to the output.

Subsequently, the TabContainer's initialization which is supposed to execute when the page is initially loaded isn't performed.

The work around is hide this control with javascript. For instance:

function pageLoad() { // this method is called automatically when the page is loaded on client side according to the life cycleof ajax script library

tc2 = $get("TabContainer1");
tc2.style.visibility="hidden"; // hide it with javascript

}

Hope this helps.

Does anybody have another solution to this? Because having the control rendered is not an option to me.

Hello,

Did you find a solution to this? I am having the same problem and would like to see what you have implemented.

Thanks

Add an empty (Without TABs) TabContainer somewhere on the page (but keep it Visible). It will not render any visible content to the page, but make CSS to be loaded from the beginning.

-yuriy