Dynamically load content based on selection

Hi All,

Based on selections of checkboxes, I want to be able to dynamically load content on a summary page.

Let me give you an example, let’s say I’m building a site where you can find information about a car manufacturer.

My four checkbox options are:

Audi
BMW
Ford
Toyota

You can select one, or all of them to find out more information. Once you’ve made your selection, it will take you to a new page where it will show you the information of each. Each manufacturer selected will have it’s information contained in it’s own container, and the container will contain buttons to allow you to find out more information (i.e, there’s a car models button that you click on which will launch a pop-up showing you the different models.

I can get the containers to be visible based on the checkbox value, but the will be visible based on where I originally laid them out, if you only select BMW and Toyota, it should shift the content around.

Think of it kind of like the workflow page when you add a new event.

Hope this makes sense and thanks for your help!

I believe what you’re looking for is displaying a list of things “car manufacturers” in a repeating group. This way when you make your selections “checkboxes” the appropriate corresponding “car manufacturers” are sent to the new page and subsequently the repeating group display only corresponding car manufacturers. There is a tutorial on bubbles main page “Sending data to pages” in the new page the repeating group of each car manufacturer in your case can have whatever buttons etc which could display another level of detail on that given manufacturer.

You might want to consider instead of sending it to a new page. Possibly filtering the repeating group of car manufacturers based on checkboxes.

If on the other hand you explicitly want to position a group (as you refer to a container) in a unique position along with others depending on what selected then you need to use a plug-in to position that given group in specific X and Y position on the new page this could be either px or %

If it’s the latter… then look for @jarrad plug-in “Move it” you action that on page load and pretty much move anything to any given position your heart desires

Agreed with @Bubbleboy. You probably just need to filter a repeating group of car manufacturers based on the check boxes. You wouldn’t be left with any weird gaps because it’ll change the number of cells shown based on the filtered result.

That means you just need to design a repeating group cell and that’s it. You don’t need to create a group for each manufacturer.

Thanks for the responses, I’m trying to create up the repeating group, but can’t work out exactly how I can get it to pull in the data I want. What I need is for it to pull in a few checkboxes and a bit of text that’s dependant on the car manufacturer you select.

Anyone able to help with how to pump the data into a repeating group?

do the tutorials bubble provides…go to the many sites setup by various people to learn how to do stuff … or see the videos https://bubble.io/documentation “display data in a repeating group”

Thanks, I understand how to pull in basic data into repeating groups such as text etc, but it’s more complicated data like I said earlier, such as pulling in a few checkbox items and a progress bar.