Tabs buttons and tabs content may be anywhere in the dom, you don't need to collect them in one dom element. It is an analog of button plugin with data-type="radio"
.
tabs = document.querySelectorAll("[data-toggle='tabs']") for tab in tabs tab.tabs()
Name | Default | Description |
---|---|---|
toggle | @el.getAttribute( 'data-toggle' ) or 'tabs' | Set toggle type. |
target | @el.getAttribute( 'data-target' ) or null | Selector to find the content of that tab button. |
group | @el.getAttribute( 'data-group' ) or null | Name of the tabs group. Uses to deactivate other tabs in the group, when one tab was activated. |
event | @el.getAttribute( 'data-event' ) or "click" | This event will be used to activate/deactivate button. |
initial | @el.getAttribute( 'data-initial' ) or 0 | Number of the tab to activate after initialization. |
Method | Description |
---|---|
activate |
Activate button. |
deactivate |
Deactivate button. |
enable |
Enable button, events will work. |
disable |
Disable button, events will not work. |
Inside each method to get tab use@
orthis
in js. Class instance always stores in data attribute of the tab element@data['kitTabs']
orthis.data['kitTabs']
in js.
Method | Description |
---|---|
beforeactive |
Set a function to call it before activate tab. If it returns tabs = document.querySelectorAll('.tabs-selector') for tab in tabs tab.tabs beforeactive: -> d = $.Deferred() tab = @data['kitTabs'] tab.el.querySelector('a').innerHTML = 'Loading...' tab._addClass '_disabled_' setTimeout -> d.resolve() ,2000 d.promise() onactive: -> tab = @data['kitTabs'] tab._removeClass '_disabled_' tab.el.querySelector('a').innerHTML = 'Active tab' ondeactive: -> tab = @data['kitTabs'] tab.el.querySelector('a').innerHTML = 'Tab' |
onactive |
Set a function to call it after tab activation. |
failactive |
Set a function to call it if activation failed. |
beforedeactive |
Call this function before deactivate tab. |
ondeactive |
Call this function after deactivate tab. |
faildeactive |
Set a function to call it if deactivation failed. |