This is a basic usage of SmartUI's Tab
class. If you want to know more about the real HTML layout, click here
SmartUI::Tab($tabs [, $options = array()])
The $tabs
parameter will initiate the number of tabs displayed. You can pass either an assoc
array that contains tab ids or just an array
(not recomended) hense ids will be the zero base index number.
$tabs = array(
'my-tab-1' => array(
'content' => '',
'title' => 'Tab 1',
'icon' => '',
'dropdown' => '',
'position' => '',
'active' => false,
'fade' => false
),
'my-tab-2' => array(
'content' => '',
'title' => 'Tab 2',
'icon' => '',
'dropdown' => '',
'position' => '',
'active' => false,
'fade' => false
)
// so on ...
)
// or ...
$tabs = array(
'my-tab-1' => 'Tab 1', // value acts as the 'title' property
'my-tab-2' => 'Tab 2',
// so on ...
);
// or ...
$tabs = array('Tab 1', 'Tab 2'); // tab #0 and #1 as ids
$ui = new SmartUI;
$mytabs = array(
'my-tab-1' => 'Tab 1',
'my-tab-2' => 'Tab 2'
);
$tab = $ui->create_tab($mytabs);
$tab->content('my-tab-1', 'This is the content of my tab 1');
$tab->content('my-tab-2', 'This is the content of my tab 2');
$tab->print_html();
Below are the list of available properties for the class:
An array
. The list of tabs (provided upon creation of SmartUI::Tab
)
$tab->tab('my-tab-1', array('content' => 'The content of this tab'));
// or ...
$tab->tab('my-tab-1', 'My Tab 1'); // set as tab's 'title' property
An array
or closure
of tabs with their content
property.
$tab->content = array(
'my-tab-1' => 'This is the content of my tab 1'
);
// or ...
$tab->content('my-tab-1', 'This is the content of my tab 1');
// or even closure with callback (optional)
$tab->content('my-tab-1', function($this, $tabs) {
return 'This is the content of my tab and I am coding some stuff here to return';
}, function($this) {
// your callback code here ...
})
Below other properties that are using the same setup as Tab::content
property
This one uses SmartUI::print_dropdown
function. You can either pass an array
of the dropdown's format or pure HTML
string. Passing a closure
needs you to return either array
or HTML string
$dropdown_items = array(
'<a href="javascript:void(0);">Some action</a>',
'<a href="javascript:void(0);">Some other action</a>',
'-',
'<a href="javascript:void(0);">Some action below separator</a>'
);
$tab->dropdown('my-tab-2', $dropdown_items);
A string
- id attribute of <div class="tab-content ... " ... > ... </div>
A string
- id attribute of <ul class="tabs ... " ... > ... </div>
An array
- options available for the class
$options = array(
'bordered' => true,
'position' => '',
'pull' => '',
'padding' => 10,
'widget' => false
);
// sample call
$tab->options('bordered', true);