Accordion styled FAQ

Please I need help resolving my accordion FAQ.

I have successfully used Toggle to get each answer to open when a question is clicked, but I want the answers to collapse back when another question is toggled rather than toggling its particular question back.

I tried using custom states in a repeating group but a new answer will show while the previous one is still showing. I also tried using group focus in a group too but I am yet to get what I want.

Please see the screenshots below for reference.

Hey @monyeraph,

Have you unchecked fixed width and check your aligning for that text?

1 Like

Yes. the width and aligning don’t really affect collapsing groups. I am just primarily concerned about the collapsing for now.

Do you have the collapseable option selected?

I do.

It collapses at the moment when toggled. What I want is for “question 2” or “question 5” to hide, when “question 7” is toggled on.

This is what I have
https://oje.bubbleapps.io/version-test/faq?debug_mode=true

This is what I want

https://plc.rightmove.co.uk/about-us/faqs.aspx

Ah, I see. So you’re basically trying to collapse everything else when one of them are clicked? If so, is everything in a repeating group or individual groups?

I’ve tried both options as seen in the images I attached. Do you have a method to achieve it?

@monyeraph

2 Likes

Hello monyeraph,

Have you got the solution for the trick If yes then please share it. I’ve also tried so many combinations of options I can think of but nothing works.

Thanks in Advance.

I have a similar use case and I used the free Orchestra plugin: Orchestra (repeating group addon) Plugin | Bubble

When a cell is expanded / toggled I trigger the Musician inside the cell, and then I use the Maestro element outside the RG to trigger Maestros to toggle their cell to close.

1 Like

Just use a custom state to determine which answer to show, and a condition on the group inside the RG to collapse or expand it based on that custom state.

1 Like

Thanks @msgiblin. This plugin is awesome.

1 Like

Thanks @adamhholmes. It is working now. Even though I’m using a custom state I just missed (referencing the Parent Group’s “Question” text element value in the custom state).