Tab Control

An easy and convenient way to group data and present it in tab pages.

A smart way to organize information

The tab control lets your users select the information they want to see and bring it to view by clicking on its tab header.

Tab Pages

The TabPage class exposes a variety of properties that allow you to specify in details the appearance of each tab including its image, size, title and tooltip. Tab pages can load any web page as a template or navigate to an URL. Another set of properties allows you to control user actions performed on the page: whether it can be dragged and dropped, closed, selected and more.

Online Sample: A Sample Food Application That Presents Data in Tabs
Online Documentation: The TabPage class | Tab Control with Page Templates

User Interaction

Various properties let you control how the tab control responds to user actions. You can enable drag and drop of tabs, multiple selection of tab pages or disable the entire tab control.

Online Sample: Tabs

Appearance

The tab control provides different properties that let you adjust its size and the size of its items. You can choose between horizontal or vertical orientation and specify the size of the tab strip.

Online Sample: JavaScript Simple Browser Application with the Tab Control

Themes & Styles

The Tab control uses CSS themes that define each element of its appearance. You can edit these themes. In addition, the cssClass property allows you to assign a custom CSS class to the control.

JavaScript ListView with Image Thumbnail

Events

The rich event set provides you with detailed information about each action the user is performing or has performed over the tab control. The long list of supported actions includes change of items, drag and drop of items, selection of items, click on the tab header and more.

Online Documentation: The TabControl Class

Methods

The TabControl API gives you methods to programmatically select and deselect items, load item data or inquire about an item - to name a few. You can also serialize the control to a Json string or load its data from a Json string.

API Overview: TabControl and TabPage