TabPanel displaying as links

Question

User-1466119671 posted

I've got a tab container with a series of tab panels.  I am running version 18.1.1 of the ajax control toolkit.  If I update to 19.1.0, the tab panels do not display as tabs, but display as links.  This also seems to be happening in the most recent version of chrome while on 18.1.1.  I have a custom css library.  I think that my custom css is not being applied.  Here is the code in my tabcontainer.  Any ideas?

<actk:TabContainer ID="tcMain" runat="server"
OnActiveTabChanged="tcMain_ActiveTabChanged"
AutoPostBack="true" CssClass="MyTabStyle" >
<actk:TabPanel HeaderText="Stage" CssClass="ajax__tab_inner" runat="server" ID="tpStage" AccessKey="2">
<HeaderTemplate>
Stage
</HeaderTemplate>
<ContentTemplate>

......

</ContentTemplate>
</actk:TabPanel>
......
</actk:TabContainer>

Answer 1

User665608656 posted

Hi Wallym,

According to your description, I have create a TabContainer as you provided , and I have update the ajax control toolkit to the newest version 19.1.0, which works the same as 18.1.1 version.

I recommend that you try to delete all css and make sure that you download the correct version of ajaxtoolkit.

If not, please provide us with your detailed code for reference.

Here is the result as below:

Best Regards,

YongQing.

Answer 2

User-1466119671 posted

Apologies as I have been out the last two days.

The problem appears to be that there was another item in my web.config file that I changed at the same time.  This was the "Content-Security-Policy."  Now that I have fixed that as well, I think I have things working.  The biggest problem that I have now is that I have manually modified my tabcontainer css and I need to get that back to the way it was before.

Thanks for your help,

Wally

Answer 3

User665608656 posted

Hi Wallym,

The biggest problem that I have now is that I have manually modified my tabcontainer css and I need to get that back to the way it was before.

I'm not sure what your tabcontainer css is for.

If you want to use tabcontainer's own style, you just need to delete the css style referenced by your page.

Best Regards,

YongQing.

Answer 4

User-1466119671 posted

I did 3 things. 

• I uninstalled the ajax control toolkit along with something called the ajax control toolkit static resources.
• There is a directory called content that seems to have a lot of css files in it.  I am not sure where this came from.  I removed it.
• reinstalled the ajax control toolkit from nuget.

This seems to resolve this problem.  The tab container/panel is performing as expected.  I have another issue that is much smaller and I will post in another question.

Wally