Accordion
Examples
To render accordion, use the class chi-accordion.
Base #
Content goes here
Content goes here
Content goes here
Nested #
Content goes here
Content goes here
Content goes here
Content goes here
Content goes here
Content goes here
Show / Hide / Toggle of individual items of Accordion #
Expand / Collapse all Accordion items #
Disabled #
Make Accordions appear inactive by adding the class -disabled or the attribute disabled to Accordion trigger
Content goes here
Truncated #
Truncate long accordion titles by adding the class -truncated to chi-accordion.
Content goes here
JavaScript
Methods
Method | Description | Returns |
|---|---|---|
hide() => void | Hides the accordion or individual accordion item (if provided) | Type: void |
show() => void | Shows the accordion or individual accordion item (if provided) | Type: void |
toggle() => void | Toggles active state (show/hide) of the accordion or accordion item (if provided) | Type: void |
expandAll() => void | Expands all the accordion items | Type: void |
collapseAll() => void | Collapses all the accordion items | Type: void |
Preventing memory leaks
Accordion component has a dispose function to free all the resources attached to the element, such as event listeners and object data. You should call this method when you want to remove the component.
It is safe to call the accordion method more than once, as it will return any previously created accordion component associated with the element.