Use Toggle to Show or Hide Groups

Using Toggle to Show or Hide Groups in Your Bubble.io No Code Web App

Using a Toggle to Show or Hide Groups in Your Bubble.io No Code Web App’s Repeating Group’s Cells

I had a fellow Bubble developer ask how to use a toggle in a Repeating Group (“RG”) to show or hide a Group within each RG’s Cell. There also needed to be a button outside of the RG which would hide any visible Groups when pressed. In this video, you’ll see how quick and easy it is to implement a solution which you might find useful in your Bubble no code web app.

One of the pro tips to know about for this design to work is using the “Clear list” command for the RG. Refer to the image below and Bubble’s reference guide.

Clear List for RG
Step to Clear List in Repeating Group

Another design implementation to be aware of is the use of Conditionals to either show or hide each Group based on the value of the IonicToggle used in each RG Cell. See image below from the design.

Group in RG
Visibility Conditionals for Group in RG

As you can see in the video, implementing the ability to show or hide a Group in a RG Cell isn’t too complicated. And having a Button to reset the RG so the Groups are hidden is a nice capability provided by Bubble. Try using some of this design in your app design and create some cool app features.

FREE ACCESS to this Bubble.io design when you join our email list!

Leave a Reply