Difference between revisions of "Using the JHtmlTabs class in a component"
From Joomla! Documentation
Dilbert4life (talk | contribs) (adding example for JHtml::_('tabs')) |
m |
||
(15 intermediate revisions by 5 users not shown) | |||
Line 1: | Line 1: | ||
− | This article covers usage of JHtmlTabs in your Joomla! component for Joomla! versions 1.6 and greater. If you are using Joomla! 1.5, see [[ | + | {{version|2.5,3.0}} |
+ | |||
+ | This article covers usage of JHtmlTabs in your Joomla! component for Joomla! versions {{JVer|1.6}} through {{JVer|2.5}} and greater. If you are using Joomla! {{JVer|1.5}}, see [[Using the JPane classes in a component]]. | ||
===Options for JHtmlTabs=== | ===Options for JHtmlTabs=== | ||
− | '''onActive''': A callback function when a tab is activated | + | '''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 | '''onBackground''': A callback function when a tab is backgrounded | ||
+ | |||
'''startOffset''': The default tab to start with (zero based index). | '''startOffset''': The default tab to start with (zero based index). | ||
− | '''useCookie''': Whether or not to use cookies to store tab active state. (true|false) | + | |
+ | '''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=== | ===Example=== | ||
<source lang="php"> | <source lang="php"> | ||
− | echo JHtml::_('tabs.start', 'tab_group_id'); | + | $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 JHtml::_('tabs.panel', JText::_('PANEL_1_TITLE'), 'panel_1_id'); | ||
Line 20: | Line 38: | ||
echo JHtml::_('tabs.end'); | echo JHtml::_('tabs.end'); | ||
</source> | </source> | ||
+ | <noinclude>[[Category:Development]]</noinclude> |
Revision as of 08:55, 1 February 2013
This article covers usage of JHtmlTabs in your Joomla! component for Joomla! versions through and greater. If you are using Joomla! , see Using the JPane classes in a component.
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');