tab container: tab panel appears but not the controls in it

Hello,

I have a ajax tab container with 4 tab panels. each panel has arround 30 to 40 controls.later I added another(5th) panel with text box control. The new panel appears, but the control in it is not displayed.

When I tested again with a new file,new tab container, with 7 to 8 panels with no controls. I just added 1 single control to 8 th panel. This time it displays properly.

I am unable to figure out whether it is problem with tab container control, because it has too many controls? I am using ajax control toolkit version 1.0.10301.0.

(or)

problem with the html content I wrote.Here is my code.Pls help.Its urgent

<divid="divMain"style="overflow: auto">

<cc1:TabContainerID="TabContainer1"runat="server"Visible="true"ActiveTabIndex="2">

<cc1:TabPanelID="tpCallHandling"runat="server">

<HeaderTemplate>

Call Handling</HeaderTemplate>

<ContentTemplate>

<tablewidth="98%"style="height: 98%">

<tr>

<tdalign="center"colspan="5"class="aimTableH">

<asp:Labelrunat="server"ID="Label29"CssClass="aimth2"><b> Call Handling</b></asp:Label></td>

</tr>

<trclass="aimTableH"align="center">

<td>

<asp:Labelrunat="server"ID="lblEscalate"CssClass="aimth2"><b>Escalate</b></asp:Label>

</td>

<td>

<asp:Labelrunat="server"ID="Label1"CssClass="aimth2"><b>Lead Type</b></asp:Label>

</td>

<td>

<asp:Labelrunat="server"ID="Label2"CssClass="aimth2"><b>Maximum Attempts</b></asp:Label>

</td>

<td>

<asp:Labelrunat="server"ID="Label3"CssClass="aimth2"><b>Word Tracks</b></asp:Label>

</td>

<td>

<asp:LabelID="lblEmailRecipients"runat="server"CssClass="aimth2"><b>Email Recipients</b></asp:Label>

</td>

</tr>

</table>

</ContentTemplate>

</cc1:TabPanel>

.

.

.

.

.

.

.

<cc1:TabPanelrunat="server"ID="TabPanel2">

<HeaderTemplate>TESTING</HeaderTemplate>

<ContentTemplate>

<tablewidth="98%"height="100%">

<tr>

<td>

<asp:TextBoxrunat="server"ID="txt1"></asp:TextBox>

</td>

</tr>

</table>

</ContentTemplate>

</cc1:TabPanel>

</cc1:TabContainer>

</div>

<tablewidth="98%"height="100%">

In bold, that is an error... Style="height:98%" is an error too...

My guess is maybe your controls are hidden by the table...

Another tip: if you have too many controls in each tab, maybe try seperating the contents into iframes... Easier to debug..

TabContainer Issue

I've created a webform that has a modal dialog box that retrieves data from a database, then returns those values to the parent form. This functionality works fine. I recently added a tabcontainer in hopes to add tabs to the parent web form. After reformatting my form with the tabcontainer and tab panel, everything seem to be working fine until I tested the modal dialog box. It does open but when trying to pass information back to the parent form, it doesn't seem to find the fields. I am using the "document.getElementbyID" with no luck. Below is my javascript function that does work as soon as I remove the tabcontainer with its corresponding tab panel. I put them back and it doesn't work, it does return the followingerror "document.getElementById(...) is Null or not an object"

function openwindow()
{
var txt2 = window.showModalDialog("../Lookups/GroupLK.aspx", "mywindow","status=0,toolbar=0, width=700, height=250, scrollbars=1", txt2);
if (txt2 == null)
{
window.alert("Operation Cancelled");
}
else
{
document.getElementById("txtGroup").value=txt2[1].toString();
document.getElementById("txtGroupID").value=txt2[0].toString();
}
}

Any advice from the experts would be greatly appreciated. I really like to use these tabs on my form.

try using

document.getElementById('<%= txtGroup.ClientID%>').value=txt2[1].toString();
document.getElementById('<%= txtGroupID.ClientID%>').value=txt2[0].toString();

Yes...that did it thank you! But I am still puzzled by the whole "tab container" concept. Why are fields somehow not available. After making the changes as you mentioned above, and proceeding to submit my form the sqldatasource1.insert() is not working. I get the following error "Could not find control 'txtReceived' in ControlParameter 'letter_recv_date' ". Again, if I remove the tab container and leave all the fields onto a form, it works fine. Any additional insights would be appreciated.

Hi Rnino3,

Control's ID usually does same as its ClientID when the control is inside another Container.

For example, TextBox1 inside TabContainer1 , its ClientID should be TabContainer1_TabPanel1_TextBox1. You can find in the generated HTML code. So in your situation, please use <"%=txtReceived.ClientID%"> instead of txtReceived.

Best regards,

Jonathan