asp.net AjaxControlToolKit–TabContainer控件的介绍控件的介绍
AjaxControlToolKit–TabContainer控件的介绍收藏
1. Introduction:
Tab本身就应该是个以页签形式显示组织网页内容的一个控件。在AJAX Control Tool Kit的控件中有TabContainer控件,它是一
些TabPanel控件的载体,而每个TabPanel可以像标准的Panel控件一样,成为其它一些ASP.NET控件的容器。TabPanel通过它
的三部分结构HeaderText, HeaderTemplate和ContentTemplate属性来指定它的内容。
TabContainer控件具有保持当前页面状态的能力。当页面发生刷新后,最新被选中的Tab将被保持其选中的状态;此外每个Tab
的可操作属性页可以保持。
2. Properties:
<ajaxToolkit:TabContainer runat=”server” OnClientActiveTabChanged=”ClientFunction” Height=”150px”>
<ajaxToolkit:TabPanel runat=”server” HeaderText=”Signature and Bio” <ContentTemplate> … </ContentTemplate> />
</ajaxToolkit:TabContainer>上面就是TabContainer的结构,它分为两大部分,TabContainer的属性部分和TabPanel属性部分。
TabContainer属性:
a. ActiveTabChanged(Event): 当选中的Tab被改变的时候触发的事件(服务器端事件)。
b. OnClientActiveTabChanged: 当选中的Tab改变时触发的客户端脚本事件。
c. CssClass – 被用于定义其客户表现的 Css Class 样式,它具有默认的 Tab 主题样式,但是也可以根据实际需要进行修改
d. ActiveTabIndex – 初始化被设置为选中的 Tab
e. Height – 其中 Tab 的高度(不包括其标题栏)
f. Width – 其中 Tab 的宽度
g. ScrollBars – 是否显示滚动条,可以设置为、None、Horizontal、Vertical、Both 或者 Auto
TabPanel属性:
a. Enabled – 是否显示该 Tab 页,该属性可以在客户端脚本中改变
b. OnClientClick – 当被点击时触发的客户端脚本事件名称
c. HeaderText – Tab 标题
d. HeaderTemplate – 一个 TemplateInstance.Single ITemplate 用来其定义标题
e. ContentTemplate – 一个 TemplateInstance.Single ITemplate 用来其定义内容
特别需要注意的是CssClass可以设定为你自定义格式的CSS,假如你的CssClass为Customer,需要自定义的Css属性有以下这
些:
Tabs Css classes
代码如下:
· .ajax__tab_header: A container element that wraps all of the tabs at the top of the TabContainer. Child CSS
classes:.ajax__tab_outer.