Tabs Binding
The tabs binding is a simple implementation of the ubiquitous javascript tabs.
Useful in template binding scenarios where you need tabs in a more complex Knockout interface.
If the jquery cookie plugin is included the tabs will remember which one was selected.
Note: This feature will not work in chrome from a local file version of this example due to a restriction on writing local cookies.
Usage
Markup
Javascript
Results
Options
Tab Set
Name |
Description |
Default |
id | An id for the tab set, used to identify the the tab state in the cookie | |
tabs | An array of tab definitions. | |
remember | Whether the state of the tabs is saved in a cookie | false |
Tab Definitions
Name |
Description |
Default |
name | The name that appears in the tab itself. Also used as the unique identifier. | 'folder' |
bodyCssClass | The css class applied to be inner tab body div. | |
create | Function used to create the tab body. This can be a function definition or the string name of the function. The tabs will try to evaluate the string if a function type is not detected (useful when the configuration is passed via json). | |
iconCssClass | A cssClass applied to a span inside each tab, can be used to add an icon. | |
isActive | Whether the is selected initially. | |
Dependencies
- Knockout 1.2.0
- Jquery 1.6+
- Jquery tmpl
- Jquery cookie (optional)
- Knockout UI Util