Search results

AccordionItem

An item object that is used to configure Accordion items.

Properties

content

string

Sets the text content to be displayed for the Accordion item. You can set the content of the Accordion item using content property. It also supports to include the title as HTML element, string, or query selector.

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

Defaults to undefined

cssClass

string

Defines single/multiple classes (separated by a space) are to be used for Accordion item customization.

Defaults to undefined

expanded

Boolean

Sets the expand (true) or collapse (false) state of the Accordion item. By default, all the items are in a collapsed state.

Defaults to ‘false’

Sets the header text to be displayed for the Accordion item. You can set the title of the Accordion item using header property. It also supports to include the title as HTML element, string, or query selector.

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

Defaults to undefined

iconCss

string

Defines an icon with the given custom CSS class that is to be rendered before the header text. Add the css classes to the iconCss property and write the css styles to the defined class to set images/icons. Adding icon is applicable only to the header.

  let accordionObj: Accordion = new Accordion( {
       items : [
         { header: 'Accordion Header', iconCss: 'e-app-icon' }]
       });
  accordionObj.appendTo('#accordion');
.e-app-icon::before {
  content: "\e710";
}

Defaults to undefined