How to use Salesforce Lightning Accordion in Lightning Component?

How to use Salesforce Lightning Accordion in Lightning Component?

Accordion :

An accordion allows a user to toggle (show and hide) the display of a section of content.

In Lightning Framework lightning:accordion component groups related content in a single container. Lightning :accordion can only used in a lightning component if the version of component is 41.0 or later. A Lightning accordion have sections, out of these sections only one section can be expanded at a time. Selecting a section either expands it or collapses it.

The first section of Lightning:accordion is expanded by default. The default value can be change by setting the value for ‘activeSectionName’ attribute. If two or more than two accordion section use the same name and the value for ‘activeSectionName’ attribute is also set as that name then the first section is expanded by default.

Let’s understand the functionality of Lightning Accordion with an example. Here in the below example we will retrieve the list of accounts and show each account as an accordion section.

Below is a snippet of code for Salesforce Lightning Component :

Below is the snippet of Salesforce JavaScript Controller :

Below is the snippet of code forSalesforce Apex controller :

Below is a video showing the Output of the Salesforce Lightning Component :



Leave a Reply


We're not around right now. But you can send us an email and we'll get back to you, asap.


About Us

Forcetalks is a Salesforce collaboration platform for coders & developers, geeks & nerds, consultants & business heads, admins & architects, managers & marketers and of course the business owners. A community where you can learn from, where you can contribute to. For you. For Salesforce. Read More...

Copyright 2020 Forcetalks. All Right Reserved.

Log in with your credentials


Forgot your details?