<layout:tablist> </...>

Defines a container for a set of tabs.

Content

<layout:tablistitem>

At least 1 TabListItem.

Attributes

defaultTabId

string

The tab which is defaultly open upon the page initially loading

string

(Required) Give this control a unique id. Can be accessed in the client DOM (eg, document.getElementById('myid') or in the server DOM using [? $myid ?] or [? $('myid') ?]).

panelbgcolor

string

Panel Background Color

Background Color of the content panel in the Tablist

panelfontcolor

string

Panel Font Color

Font Color of the content panel in the Tablist

panelpadding

int

Panel Padding

Controls the padding of the content panel in the Tablist

tabbgcolor

string

Tab Background Color

Background Color of Tabs in the Tablist

tabborder

string

Tab Border

Applies a Border to the Tabs in the Tablist

tabborderradius

int

Tab Rounded Corners

Controls how rounded the corners of the Tabs in the Tablist are

tabfontcolor

string

Tab Font color

Font Color of the Tabs in the Tablist

Examples

Specify Default Tab

Demonstrates the tablist defaultly opening a tab other than the first tab.

HTML:

<layout:tablist defaulttabid="tablistitem2"> <layout:tablistitem id="tablistitem1" title="Tab List Item 1"> Tab List Item 1 is first, but not open by default. </layout:tablistitem> <layout:tablistitem id="tablistitem2" title="Tab List Item 1"> Tab List Item 2 is open by default. </layout:tablistitem> </layout:tablist>

Run Example

Specify Default Tab via Query String

Demonstrates the tablist defaultly opening a tab specified through the query string.

HTML:

<layout:tablist defaulttabid="[? $_GET['tab'] ?]"> <layout:tablistitem id="tablistitem1" title="Tab List Item 1"> Tab List Item 1 is first, but not open by default. </layout:tablistitem> <layout:tablistitem id="tablistitem2" title="Tab List Item 1"> Tab List Item 2 is open by default. </layout:tablistitem> </layout:tablist> <a href="?tab=tablistitem2">A link to the second tab</a>