Good evening. I use the MIGX configuration . In a chunk
<div class="accordion-items">
<h2 class="accordion-header" >
<button class="accordion-buttons collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseExample" aria-expanded="false" aria-controls="collapseExample">
[[+title]]
<span class="accordion-btn"></span>
</button>
</h2>
<div id="collapseExample" class="accordion-collapse collapse" aria-labelledby="" data-bs-parent="#collapseExample">
<div class="accordion-body">
[[+description]]
</div>
</div>
</div>
Good evening. I use the MIGX configuration . When one is revealed, all are revealed. How to fix it?

dejaya
2
I think what you’re missing is a unique identifier for each accordion.
In your code above we see the identifier collapseExample
in four places.
Try adding -[[+idx]]
to each of them:
<div class="accordion-items">
<h2 class="accordion-header" >
<button class="accordion-buttons collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseExample-[[+idx]]" aria-expanded="false" aria-controls="collapseExample-[[+idx]]">
[[+title]]
<span class="accordion-btn"></span>
</button>
</h2>
<div id="collapseExample-[[+idx]]" class="accordion-collapse collapse" aria-labelledby="" data-bs-parent="#collapseExample-[[+idx]]">
<div class="accordion-body">
[[+description]]
</div>
</div>
</div>
Untested - so fingers crossed …
Thank you very much. I didn’t even pay attention to it.
1 Like
dejaya
4
Glad you’ve got it working 
thank you for your feedback
dejaya
6
Just to tidy up, I’ve added an ID to your H2 tag below.
This ID is what should go in the aria-labelledby
parameter for your <div id="collapseExample-[[+idx]]" ... >
See below.
Also, your data-bs-parent
parameter should contain the ID of your outer div, not what I suggested earlier:
<div class="accordion" id="yourAccordionID">
<div class="accordion-items">
<h2 class="accordion-header" id="accordion-header-[[+idx]]">
<button class="accordion-buttons collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseExample-[[+idx]]" aria-expanded="false" aria-controls="collapseExample-[[+idx]]">
[[+title]]
<span class="accordion-btn"></span>
</button>
</h2>
<div id="collapseExample-[[+idx]]" class="accordion-collapse collapse" aria-labelledby="accordion-header-[[+idx]]" data-bs-parent="#yourAccordionID">
<div class="accordion-body">
[[+description]]
</div>
</div>
</div>
</div>
1 Like
Understood you. I will apply it. thank you very much
1 Like