hi there,

my tabcontainer is always rendered as hidden.

this is the asp code

 

      <td class="text1">
        <ajaxToolkit:TabContainer runat="server" ID="TabContainer1" Visible="true">
          <ajaxToolkit:TabPanel runat="server" ID="TabPanel1" HeaderText="TabPanel1">
            <ContentTemplate>
              TabPanel1
            </ContentTemplate>
          </ajaxToolkit:TabPanel>
          <ajaxToolkit:TabPanel runat="server" ID="TabPanel2" HeaderText="TabPanel2">
            <ContentTemplate>
              TabPanel2
            </ContentTemplate>
          </ajaxToolkit:TabPanel>
          <ajaxToolkit:TabPanel runat="server" ID="TabPanel3" HeaderText="TabPanel3">
            <ContentTemplate>
              TabPanel3
            </ContentTemplate>
          </ajaxToolkit:TabPanel>
        </ajaxToolkit:TabContainer>
      </td>

  and this is how it renders

 

<td class="text1">
        <div class="ajax__tab_xp" id="ctl00_ContentPlaceHolder1_TabContainer1" style="visibility:hidden;">
	<div id="ctl00_ContentPlaceHolder1_TabContainer1_header">
		<span id="__tab_ctl00_ContentPlaceHolder1_TabContainer1_TabPanel1">TabPanel1</span><span id="__tab_ctl00_ContentPlaceHolder1_TabContainer1_TabPanel2">TabPanel2</span><span id="__tab_ctl00_ContentPlaceHolder1_TabContainer1_TabPanel3">TabPanel3</span>

	</div><div id="ctl00_ContentPlaceHolder1_TabContainer1_body">
		<div id="ctl00_ContentPlaceHolder1_TabContainer1_TabPanel1">
			
              TabPanel1
            
		</div><div id="ctl00_ContentPlaceHolder1_TabContainer1_TabPanel2" style="display:none;visibility:hidden;">
			
              TabPanel2
            
		</div><div id="ctl00_ContentPlaceHolder1_TabContainer1_TabPanel3" style="display:none;visibility:hidden;">
			
              TabPanel3
            
		</div>
	</div>
</div>
      </td>

  can any advise me how to fix this please?

 

Maurice 

it may be obvious to most people but the first div is meant to have the style="visibility:hidden;" but the control is never rendered to the screen, i.e. i cant see the tabs.

 

Maurice 

 I've dynamic TabContainer (in code behind), and yourTabContainer.ActiveTabIndex = 0; helped me to solve this issue.

I also have this same problem where the tabcontainer and its tabpanels are always hidden. The HTML markup is all there when you view source of the page but the container and panels have a style attribute of visibility:hidden.

This displays fine in IE6 but under Firefox 1.5.0.12 the tabs are always hidden.

 

Does any one have any ideas why it does this? 

I managed to fix my problem.

The problem was I had a calendar extender control within the tabpanel that had its ondateselection property set. For some unknown reason with that property set, Firefox refuses to display the tabcontainer. 

I have the same problem with the tabcontainer getting hidden.  It's happening on IE6 on some (but not every) postback

Any ideas?

I have the same problem, of FF and IE7 the Tabs are hidden. Any ideas?

<div>
        <ajaxToolkit:TabContainer ID="Tabs" runat="server" Width="788px" Height="610px" Visible="true" 
        OnClientActiveTabChanged="ActiveTabChanged">
        <ajaxToolkit:TabPanel HeaderText=" List ">
        First Tab
            <ContentTemplate>List </ContentTemplate>
        </ajaxToolkit:TabPanel>
        <ajaxToolkit:TabPanel HeaderText="Info ">
            <ContentTemplate>Info </ContentTemplate>
        </ajaxToolkit:TabPanel>        
    </ajaxToolkit:TabContainer>
            Current Tab:
        <asp:Label runat="server" ID="CurrentTab" /><br />
        <asp:Label runat="server" ID="Messages" />
    </div>

   This is how it is rendered

    <div>
        <div id="Tabs" class="ajax__tab_xp" style="width:788px;visibility:hidden;">
	<div id="Tabs_header">

	</div><div id="Tabs_body" style="height:610px;">

	</div>
</div>
            Current Tab:
        <span id="CurrentTab"></span><br />
        <span id="Messages"></span>
    </div>

 

Hello,

 It seems you have to set the ActiveTabIndex to 0 programmatically to make the TabContainer visible.

 
By the way, I have another error with the tab container.

I add some tab in my tab container programmatically. ie :

 

1            QuarterCalculationContainer.Tabs.Clear()
2            For i As Integer = 0 To yearForecasts.ForecastsList.Count - 1
3                Dim panel As New TabPanel()
4                panel.ID = "Panel_" & yearForecasts.ForecastsList.Keys(i).QuarterId & "_" & yearForecasts.ForecastsList.Keys(i).QuarterYear.Value
5                panel.HeaderText = yearForecasts.ForecastsList.Keys(i).ToString()
6                Dim table as New Table()
7                panel.Controls.Add(table)
8                QuarterCalculationContainer.Tabs.Add(panel)
9            Next
10           QuarterCalculationContainer.ActiveTabIndex = 0

It works fine when the page renders for the first time, but in each panel, I have some button.

When I click on one of those buttons, an exception is caught, because the Tab Container has 0 panel, and the ActiveTabIndex  is set to 0.

 Does anybody know how to make the Tab Container remember of its panels ?

Thanks a lot

Vincent 

 


 

It seems if you embed another ajax control within a panel the entire container does not render. I've had something similar happen when nest a modal popup panel within a tab panel....

I had the some problem this morning and even though my solution may be specifc to my project, I like to share it:

I noticed that style="visibility:hidden;" is always on the TabContainer, even if the thing is displayed, this means the visibilty is turned on by JavaScript. I turned on Firebug in Firefox and noticed that Sys was 'undefined', meaning something with the loading of the Ajax Javascript libraries didn't work.

I copied the url that loads the libraries into a new browser tab:

http://localhost/ScriptResource.axd?d=if6MgqMBxAvS ....

And there I got an ASPX error page, in my case this was because I have a custom HTTP module I use for authentication and that did some stuff that didn't work on the *.axd file. So I fixed that so the axd? returned proper JavaScript. After that the tab control was displayed fine.

So check that all the Ajax JavaScript libraries are loading correctly on your page, if you have this problem. 

 

Yes, I would say that generally this happens when the libraries do not load properly, but I think the root of the problem is what is being coded to cause the libraries not to load properly, correct? Whether it be a property being set on one of the controls or a mistake in one of the js functions.

So I guess I am asking what did you change in your code that alleviated the problem of the libraries loading?

So I have the most general code possible for this and the tab control does not render.

I put this in its own page just to see if any other ajax controls on the page were causing the issue.  And it still does not render.

I've used the ToolKitScriptManager and the asp:ScriptManager and nothing seems to matter. 

I posted my http://localhost/ScriptResource.axd?d=HO56COP..... in my browser and it returned just fine.  However, I am using VS2005 and the information that returned was the for the 3.5 framework:

// Name:        MicrosoftAjaxWebForms.debug.js
// Assembly:    System.Web.Extensions
// Version:     3.5.0.0
// FileVersion: 3.5.21022.8

 Would that have an affect on why my tab control is always hidden?

Any ideas? 

Here is the code:

<AjaxToolKit:ToolkitScriptManager ID="a" runat="server" CombineScripts="true" />
            <AjaxToolKit:TabContainer ID="tab1" runat="server">
                <AjaxToolKit:TabPanel HeaderText="Tab1">
                    <ContentTemplate>
                        page 1 page 1
                    </ContentTemplate>
                </AjaxToolKit:TabPanel>
                <AjaxToolKit:TabPanel HeaderText="Tab2">
                    <ContentTemplate>
                        page 2 page 2
                    </ContentTemplate>
                </AjaxToolKit:TabPanel>
            </AjaxToolKit:TabContainer>
 

It's been a couple days with no reply.  Anyone have an idea here?  Or would any more information be helpful?? 

I am having the same issue.  It's like aploessl1 says: it happens whenever another ajax control is inside a tab page.  I also notice that there are two javascript errors when the page loads:

"a has no properties"
"a._events has no properties"

These errors are within one of the ASP.NET Ajax script modules.

So here's what I guessing is happening.  ASP renders the HTML with the tab element as hidden, and it's the job of client side code to make them visible.  Kind of kooky it does it this way, but that's my guess.  I'm guessing the JS is bombing before it can get around to making the tab visible.

Now, why does having an Ajax control inside the TabContainer cause this error?  Sadly, I'm pretty much at the end of my troubleshooting rope.  ASP.NET puts all of the JS code on one line, so Firebug is useless.  This has chewed up the better part of a day.  Hopefully someone out there has an answer.


 

I have solved this for my own situation.  The TabContainer included a ModalPopupExtender.  The CancelControlID property on the extender was set to a non-existent control.