tabs

Description

Creates container elements that Spawner tab elements are spawned into.

Spawner Widget Name

CODE

kind: tabs

JavaScript Method

CODE

XNAT.ui.tabs.init()

Configuration Options

CODE

adminTabs:
    kind: tabs
    label: Administer XNAT
	container: "#id-for-container"
    [name]: adminPage
	[layout]: left
	groups:
   		tabGroup1: First Group
   		tabGroup2: Second Group
   		tabGroup3: Third Group
		[etc]
    contents:
		[Spawner objects]

Properties

(required config properties are bold)

Name	Value	Description
kind	tabs	Spawner widget type - creates container elements for all page components of a tabbed interface.
label	(string)	Header text.
container	(string - selector)	Selects existing DOM element to use as a container for the tabs.
name	(string)	Arbitrary, but meaningful, name for these tabs.
layout	left / top	Specify tab layout - left is default.
groups	(object)	Object map containing group ids (property names) and their labels (values).
contents	(Spawner objects)	One or more Spawner element config objects for tabs that will be inside this `tabs` parent element.

HTML Output

Generic Example

CODE

<div class="content-tabs xnat-tab-container">
    <div class="xnat-nav-tabs side pull-left">
        <ul class="nav tab-group" id="foo">
            <li class="label">Foo</li>
			<!-- tab flippers rendered here -->
        </ul>
    </div>
    <div class="xnat-tab-content side pull-right">
        <!-- container for all tab panes -->
    </div>
</div>