How to Navigate Reviews with "Next" and "Previous" Buttons on a popup

graziellamk · 2025-03-28T19:47:01.887Z

Hi everyone,

I’m building a reviews system similar to Amazon on Bubble. I have:

RG1: Displays all reviews for a product.
RG2 (inside RG1): Shows images related to each review.
RG3: Displays all images from all reviews for the product.
A popup that opens when clicking on an image in RG2 or RG3, showing the full review and its images.

Clicking an image correctly sets the review and main image in the popup.

Issue: I can’t make the “Next” and “Previous” buttons work to navigate reviews inside the popup.

I tried filtering Do a search for Reviews with Created Date > Current Review's Created Date but it’s not working.
I need the buttons to update both the review and the main image inside the popup.

Any ideas on how to properly structure this? Thanks in advance!

Screenshot 2025-03-28 at 19.32.251920×984 102 KB

Screenshot 2025-03-28 at 19.32.511920×987 128 KB

NexradJosh · 2025-03-28T22:08:12.322Z

Sure thing!

First, add a new state to the Popup called “Displayed” with a data type of “number”.

Instead of doing another search, you want to refer to the list of reviews within RG1. Your popup should have a data type of Review, and the Data Source should be “RG1’s List of Reviews: item #: Popup’s Selected” (referring to the state you just created).

When the first image is clicked,

Set state of element Popup: Current Cell’s index
Show Popup

Now for the left and right buttons, you do this action:

Set state of Popup: Popup’s Displayed +/- 1
(plus for right, minus for left)

You should hide the left button if Popup’s Displayed is 1, and you should hide the right button if Popup’s Displayed = RG1’s List of Reviews:count.

There’s multiple ways to do this kind of thing, but hopefully this one is straightforward for you.

graziellamk · 2025-03-28T22:26:31.869Z

thank you, but I have tried this and it’s not working
could you have a look ?

let me know if I can share my editor to you privately

NexradJosh · 2025-03-29T00:00:35.000Z

Sure, I’ll take a look

mitchbaylis · 2025-03-29T03:02:36.821Z

put a repeating group in the popup, set it to 1 page
the data should be the same as the repeating group data on the page
on click of a review set the page to be the index of that review

then on the prev and next just page the rg like normal

graziellamk · 2025-03-29T09:35:45.901Z

thank you for your answer,

the thing is it’s a bit trickier :
I have 3 Rgs on the page
The first one’s (RG1) type of content is REVIEW and its data source is all the page’s product’s reviews.
inside this RG, there’s another RG (RG2) type of content images and data source: pictures from parent’s group’s review.
then there is a 3rd one, outside these RGs type of content : images and data source : RG1’s list of Reviews : each items’ images.

I want the user to be able to click on any images from these RG and have a pop up displayng the selected image on a main group then the written review from that image and in an RG the other images frm that review.

this works. the part that doesn’t work is when you want to view the next images from the next review. it just doesn’t seem to pass.

here is my editor if you want to have a look :

Bubble

Bubble Editor - Grazieapp1

Build stuff without code and launch a startup without a tech-cofounder! Bubble is a visual programing language. Instead of typing code, use a visual editor to build applications.

the page is “reusable_product”

it’s in French so I HOPE you will be able to understand ?
the pop up is under POPUP REVIEW and the RGs on the page are under
-Main content
–Review
—ALL images of Review
—MAIN REVIEW LIST