Tab Section

The Tab Section allows for controls to be organized in tabs and gives the user the ability to switch between the available tabs.

Like almost all SPARK controls, you can trigger events that are fired when the user interacts with the control (see the Event and Methods sections below and the Event Handling article for more information).

This section is most commonly used when wanting controls to be placed in tabs.


Default Pane Index 0-based index for the pane to show by default. If this value is not specified and if the data binding is not specified, defaults to 0. Use -1 to show no pane at all.


Tabs Style Default, Simple


Note: When setting the visibility of nested controls dynamically, use container control such as a Horizontal or Vertical Layout to preserve the visibility state of the active tab.

1. Place the container on the Tab Section content box. Set the visibility as Same as Parent.
2. Place a control or Coach View within this container.  This control can now have the visibility set dynamically, independently of the Tab Section.


These are the configuration option settings...

This is the result...

Note: When the screen width gets too narrow for all the tabs to be displayed, the tab(s) will collapse.


With the Tab Section, there are 2 types of event handlers:

  • On Load When the page loads
  • On Tab Changed When there is a tab change

You can use JavaScript logic to affect the effects of the control, depending on the event. More information on using these controls can be found in the Event Handling article.



For detailed information on the available methods for this control, access the JS Doc file.

Related Article(s)

SPARK Layout Capabilities


  • Author: Courtney Silva
  • Date Created: June 23, 2015
  • Date Modified: September 21, 2015
Was this article helpful?
0 out of 0 found this helpful
Have more questions? Submit a request