What are TabContainer and TabPanel? What are the Properties of TabContainer and TabPanel?

In this article I will explain what are AJAX TabContainer and TabPanel? What are the Properties of TabContainer and TabPanel?

TabContainer is an ASP.NET AJAX Control which creates a set of Tabs that can be used to organize page content. A TabContainer is a host for a number of TabPanel controls.

Each TabPanel defines its HeaderText or HeaderTemplate as well as a ContentTemplate that defines its content. The most recent tab should remain selected after a postback, and the Enabled state of tabs should remain after a postback as well.

TabContainer layout provides option to set TabPanels at top, topright, bottom, bottomright. TabContainer also provides option to set TabPanels at left, leftbottom, right and rightbottom by setting UseVerticalStripPlacement to true.

Now we can see how we can use ajax tab container in our application First add AjaxControlToolkit reference to your application and add

<%@ Register Namespace="AjaxControlToolkit" Assembly="AjaxControlToolkit" 

tagPrefix=" ajaxToolkit " %>

TabContainer Properties

1. ActiveTabChanged (Event) - Fired on the server side when a tab is changed after a postback
2. OnClientActiveTabChanged - The name of a javascript function to attach to the client-side tabChanged event
3. CssClass - A css class override used to define a custom look and feel for the tabs. See the Tabs Theming section for more details.
4. ActiveTabIndex - The first tab to show
5. Height - sets the height of the body of the tabs (does not include the TabPanel headers)
6. Width - sets the width of the body of the tabs
7. ScrollBars - Whether to display scrollbars (None, Horizontal, Vertical, Both, Auto) in the body of the TabContainer
8. TabStripPlacement - Whether to render the tabs on top of the container or below (Top, Bottom) 

TabPanel Properties

1. Enabled - Whether to display the Tab for the TabPanel by default. This can be changed on the client.
2. OnClientClick - The name of a javascript function to attach to the client-side click event of the tab.
3. HeaderText - The text to display in the Tab
4. HeaderTemplate - A TemplateInstance.Single ITemplate to use to render the header
5. ContentTemplate - A TemplateInstance.Single ITemplate to use to render the body