AccordionModel

23 Sep 20252 minutes to read

Interface for a class Accordion

Properties

clicked EmitType<AccordionClickArgs>

The event will be fired while clicking anywhere within the Accordion.

created EmitType<Event>

The event will be fired once the control rendering is completed.

destroyed EmitType<Event>

The event will be fired when the control gets destroyed.

expanded EmitType<ExpandedEventArgs>

The event will be fired after the item gets collapsed/expanded.

expanding EmitType<ExpandEventArgs>

The event will be fired before the item gets collapsed/expanded.

animation AccordionAnimationSettingsModel

Specifies the animation configuration settings for expanding and collapsing the panel.

dataSource Object[]

Specifies the datasource for the accordion items.

enableHtmlSanitizer boolean

Specifies whether to enable the rendering of untrusted HTML values in the Accordion component.
When this property is enabled, the component will sanitize any suspected untrusted strings and scripts before rendering them.

enablePersistence boolean

Enable or disable persisting component’s state between page reloads.

enableRtl boolean

Enable or disable rendering component in right to left direction.

expandMode ExpandMode

Specifies the options to expand single or multiple panel at a time.
The possible values are:

  • Single: Sets to expand only one Accordion item at a time.
  • Multiple: Sets to expand more than one Accordion item at a time.

expandedIndices number[]

Specifies the expanded items at initial load.

headerTemplate string|Function

Specifies the header title template option for accordion items.

height string|number

Specifies the height of the Accordion in pixels/number/percentage. Number value is considered as pixels.

itemTemplate string|Function

Specifies the template option for accordion items.

items AccordionItemModel[]

An array of item that is used to specify Accordion items.

  let accordionObj: Accordion = new Accordion( {
       items: [
         { header: 'Accordion Header', content: 'Accordion Content' }]
       });
  accordionObj.appendTo('#accordion');

locale string

Overrides the global culture and localization value for this component. Default global culture is ‘en-US’.

width string|number

Specifies the width of the Accordion in pixels/number/percentage. Number value is considered as pixels.