ajax TabControl: headers

Showing posts with label headers. Show all posts

Wednesday, March 28, 2012

Tab Container Header tabs NOT on multiple rows

This is driving me crazy. I have a webpage that has a table on it. Inside the table I have a TabContainer. I have 13 tab headers I need for the one TabContainer. I populate the tab headers by a call to the database then doing a For Loop to enter all the headers. The problem is that when I run the app the tab headers are all on one row. How do I get the Tab Headers to split up into two rows?

Thanks in advanced.

mutlyp

Hi mutlyp,

As far as I know, there is no build-in support for this feature currently. You can votehere.

Hi Raymond

I actually found the answer but it took a lot of digging on the net. It's from Nazar Rizvi's blog

http://www.narizvi.com/blog/post/Two-rows-of-tab-headers-in-TabContainer-in-Ajax-Control-Toolkit.aspx

You have to go into the Tab.css and change the ".ajax__tab_default.ajax__tab_header {}" line. Then the Tab headers will wrap.

Funny how Nazar knew this and you a Microsoft rep didn't. Maybe you guys should hire Nazar.

Mutlyp,

Thanks for that link...

Regards

Karen

Thanks for sharing, it's so helpful.

Monday, March 26, 2012

Tab headers of Tab Container within the Update Panel

I have a TabContainer inside of Update Panel. It seems that the background style of the tab header don't shows.

<asp:Button ID="Button1" runat="server" Text="View Tab" />

<asp:UpdatePanel ID="UpdatePanel4" runat="server">
<ContentTemplate>

<table id="Table1" runat="server">
<tr>
<td>
<ajaxToolkit:TabContainer ID="TabContainer1" runat="server">
 <ajaxToolkit:TabPanel ID="TabPanel1" HeaderText="Tab 1" runat="server">
 <ContentTemplate>
Text 1
 </ContentTemplate>
 </ajaxToolkit:TabPanel>
 <ajaxToolkit:TabPanel ID="TabPanel1" HeaderText="Tab 2" runat="server">
 <ContentTemplate>
Text 2
 </ContentTemplate>
 </ajaxToolkit:TabPanel>
</ajaxToolkit:TabContainer>
</td>
</tr>
</table>
</ContentTemplate>
</asp:UpdatePanel>

Is there any other ways to bring back the background style of the tab header.

Thanks in advance

Please help me on this...

You can add a CSS class to your TabContainer. The toolkit ships with the style ajax__tab_xp to ensure its loaded see below.

<Ajax:TabContainerID="TabContainer1"runat="server"CssClass="ajax__tab_xp">

If you still experince issues use fiddler www.fiddlertool.com to check that the XP style sheet is sent as a web resource.

Saturday, March 24, 2012

tab panel display problems

I am using a tab container with tab panels. The first problem is that the headers have the bottom half cut off. The second problem is that the panel will not render with the backcolor I specify. The third problem is that the panels have dynamic content that includes a button which launches a second window. When you click on the button all the information is cleared from the panels.

Would you please post some code?

Thanks

Try add the following to your aspx page:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Good luck.

Wednesday, March 28, 2012

Tab Container Header tabs NOT on multiple rows

Monday, March 26, 2012

Tab headers of Tab Container within the Update Panel

Saturday, March 24, 2012

tab panel display problems

ajax TabControl

Blog Archive

About Me