Accordion Panel
(part of package 'Bootstrap Components') Extends designtime/SolutionModel: JSWebComponent Extends runtime: RuntimeWebComponent
The AccordionPanel component is a container similar to a TabPanel, but, instead of having tabs for showing / hiding forms, it has buttons that behave like an accordion, moving one way or the other.
This is a reference page; many components have detailed usage guides here.
Properties
activeTabIndex
The index of the currently active tab in the accordion. Type: Number Default Value: 0
containerStyleClass
The CSS class(es) to be added to container element - parent of the form element. Type: Styleclass
height
Minimum height of the accordion, should be used for responsive forms. Type: Number Default Value: "500"
styleClass
The CSS class(es) to be added to accordion element. Type: Styleclass
tabIndex
The index used for tab order when setting focus. Type: Number Default Value: 1
tabSeq
The tab sequence order used during design. Type: Tabseq
tabs
Array of tabs within the accordion component. Type: Array<CustomType<bootstrapcomponents-accordion.tab>>
visible
Whether the button is visible or not Type: Visible
Events
onChangeMethodID(previousIndex,event)
Fired after a different tab is selected
Parameters:
API
addTab(form,tabText,index)
Adds a tab to this accordion with that form and text on the given index
Parameters:
Returns: CustomType<bootstrapcomponents-accordion.tab> The newly created tab object that represents the added form in the accordion component.
getTabAt(i)
Return the Tab of the given index.
Parameters:
{Number} i The 0-based index of the tab to retrieve from the accordion component.
Returns: CustomType<bootstrapcomponents-accordion.tab> The tab object at the specified index in the accordion component.
removeTabAt(index)
Removes a tab of the given index. Return true if this was sucessfull.
Parameters:
{Number} index The 0-based position of the tab to be removed from the accordion component.
Returns: Boolean True if the tab was successfully removed; false otherwise.
selectTabAt(index)
Select the tab of the given index. Return true if this was succesfull.
@deprecated use tabIndex property instead.
Parameters:
{Number} index
Types
tab
Defines a tab object for the AccordionPanel component. scripting type: CustomType<bootstrapcomponents-accordion.tab>
containedForm
The form contained within the tab.
Type: form
disabled
Whether the tab is disabled.
Type: boolean
Default Value: false
name
The unique name identifier of the tab.
Type: string
relationName
The relation name associated with the tab used for linking forms.
Type: relation
text
The text displayed on the tab.
Type: tagstring
Default Value: "tab"
Last updated
Was this helpful?