在Ajax选项卡容器中为溢出选项卡创建水平滚动选项卡 [英] Create a Horizontal Scroll Tab in Ajax Tab Container For Overflowing Tabs

问题描述

我在ajax标签容器中有很多标签，不能放入一行。所以我想为ajax选项卡容器创建一个水平滚动选项卡，使所有选项卡适合单行。



我在网上尝试了很长一段时间，但仍然无法进行找不到它的解决方案。我的ajax选项卡容器和选项卡面板将在c＃中动态创建。



这是我想要实现的输出:(见这里： http://i.stack.imgur.com/bUnK4.png [ ^ ]）

这是我的代码：

I got many tabs inside ajax tab container that cannot be fit into one row. So I would like to create a horizontal scroll tab for ajax tab container to fit all tabs into a single row.

I have tried research online for quite awhile but still couldn't find a solution to it. My ajax tab container and tab panel would be created dynamically in c#.

This is the output that I would like to achieve: (See here: http://i.stack.imgur.com/bUnK4.png[^])
This is my codes:

//Aspx file
 <div>
             <asp:scriptmanager ID="ScriptManager1" runat="server">
            </asp:scriptmanager>
        </div>
        <asp:updatepanel ID="UpdatePanel1" runat="server" ScrollBars="Horizontal">
            <contenttemplate>
        <asp:placeholder ID="PlaceHolder1" runat="server"></asp:placeholder>
 
                <asp:Chart runat="server">
 
                </asp:Chart>
 
            </contenttemplate>
        </asp:updatepanel>
 
//Cs file
AjaxControlToolkit.TabContainer container = new AjaxControlToolkit.TabContainer();
            container.ID = "TabContainer";
            container.EnableViewState = false;
            container.Tabs.Clear();
            container.Height = Unit.Pixel(2000);
            container.Width = Unit.Pixel(2000);
            container.Tabs.AddAt(0, GetManualTab());

  AjaxControlToolkit.TabPanel panel = new AjaxControlToolkit.TabPanel();
                    panel.HeaderText += item.Text;
                    container.Tabs.Add(panel);

问题：如何创建水平滚动标签对于ajax标签容器，以便将许多标签放入一行？



感谢有人可以为我提供帮助。谢谢！



问候，

Felicia

Question: How to create a horizontal scroll tab for ajax tab container in order to fit many tabs into one row?

Appreciate if someone could provide me help on this. Thanks!

Regards,
Felicia

推荐答案

<cc1:tabpanel id="TabPanel1" runat="server" headertext="TabPanel1" xmlns:cc1="#unknown">
	<contenttemplate>
	    <asp:panel runat="server" id="Panel1" scrollbars="Horizontal/Vertical" xmlns:asp="#unknown">
	        <asp:textbox id="TextBox1" runat="server" width="300px" height="30px"></asp:textbox>                 
	    </asp:panel>
	</contenttemplate>
</cc1:tabpanel>

http://www.nullskull.com/q/10136937/how-to-give-scroll-bar-in-ajax-tab-container.aspx [ ^ ]



-KR

http://www.nullskull.com/q/10136937/how-to-give-scroll-bar-in-ajax-tab-container.aspx[^]

-KR

改为使用jquery选项卡



https://jqueryui.com/tabs/ [ ^ ]



它使用div标签来保存标签。所以你可以指定div的固定宽度，然后设置它的ovreflow属性。



希望这有帮助

instead use jquery tabs

https://jqueryui.com/tabs/[^]

it uses div tag for holding tabs. so u can specify a fixed width to div and then set its ovreflow attribute.

hope this helps

这篇关于在Ajax选项卡容器中为溢出选项卡创建水平滚动选项卡的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！