Difference between revisions of "Using the JHtmlTabs class in a component"
From Joomla! Documentation
(new page for Joomla 3.x versions) |
m (version tag) |
||
Line 1: | Line 1: | ||
− | {{version/tutor| | + | {{version/tutor|3.x}} |
===Calling the Class=== | ===Calling the Class=== |
Revision as of 15:35, 8 May 2013
Calling the Class[edit]
jimport( 'joomla.html.html.tabs' );
While importing the class in the way above will bring in the class, it will not function as expected. JHtmlTabs cannot be called directly, even after importing. JHtml::_(tabs) must be called as shown in the example below.
Options for JHtmlTabs[edit]
onActive: A callback function when a tab is activated with two params. 'title' is the tab itself, and 'description' is the tab content.
onBackground: A callback function when a tab is backgrounded
startOffset: The default tab to start with (zero based index).
useCookie: Whether or not to use cookies to store tab active state. (boolean) (true | false) // This is not a string. Don't use quotes.
Example[edit]
$options = array(
'onActive' => 'function(title, description){
description.setStyle("display", "block");
title.addClass("open").removeClass("closed");
}',
'onBackground' => 'function(title, description){
description.setStyle("display", "none");
title.addClass("closed").removeClass("open");
}',
'startOffset' => 0, // 0 starts on the first tab, 1 starts the second, etc...
'useCookie' => true, // this must not be a string. Don't use quotes.
);
echo JHtml::_('tabs.start', 'tab_group_id', $options);
echo JHtml::_('tabs.panel', JText::_('PANEL_1_TITLE'), 'panel_1_id');
echo 'Panel 1 content can go here.';
echo JHtml::_('tabs.panel', JText::_('PANEL_2_TITLE'), 'panel_2_id');
echo 'Panel 2 content can go here.';
echo JHtml::_('tabs.end');