Display next item from a repeating group on index, in a popup, when a button is clicked

I have a popup Card View Reusable which when an image in the repeating group on index is clicked, it displays data in the popup for the Current cell’s Prompt.

I want a “next” button on the popup to display the next item that’s currently in the repeating group in index. This repeating group may be showing search results or favorites so I want the “next” and “previous” buttons to cycle through what’s currently showing in the repeating group on index.

Other solutions to similar Qs say I should select “Data to display” as the “Current cell’s index + 1” but I don’t know how to get the Current cell’s index, nor does there seem to be a way to add 1 to it…?

Apologies if this is an obvious question or has been solved before. I found a few other questions that are similar but I can’t work out how to apply the solutions to my app, or the answer is incomplete or no longer available.

Here is my app so you can see what I’m trying to do:

Drag your browser window narrow and it’ll display as a mobile app.

I worked out how to do this, for anyone else finding this post with the same question.

First, when the popup is opened, the current list of prompts being displayed in the RG on index, is sent to the popup as a custom state list.

Then, the “next” button does this:

  1. Uses plugin 1 Thing Plugin Index Finder to get the index number of the currently displayed Prompt.
  2. Puts this number into another custom state called List Position.
  3. Increments this number by 1 and resaves in same CS List Position.
  4. Identifies the Prompt in the CS Current List of Prompts which has the item # that is the CS List Position, and saves this Prompt into another CS called Next Prompt.
  5. Finally, displays Next Prompt as the data source of the popup.
  6. Reset the List Position and Next Prompt CS.

At step 2, I have a condition which says to only increment the List Position if it is not already equal to the count of the Current List of Prompt (ie. You’re viewing the last prompt in the list), and if it is equal to it then set it to 1 (ie cycles you back ti the first Prompt in the list).

For the button to cycle backwards through the list, the process is the same but the List Position is decreased by 1,except for when you’re already at item 1,in which case it’s set to the list count (taking you to the last item instead).

3 Likes

Hi @jcpollari,

Kudos for working out a solution! :+1:

To address your specific question though…

One thing to keep in mind is that repeating groups and lists are not one and the same. A repeating group can be thought of as a means for displaying / presenting information about list items. Thus, a RG is a UI element, and a list is data. (The Data source property of a RG represents the data to be displayed within it.)

Therefore, the word “cell” in your quoted text refers to a RG - not a list; so an alternative implementation (which would not require a plugin) would simply be to store the index of the cell that the user clicked / tapped when they first opened the popup. Then use that value as the basis for your navigation.

-Steve

Thanks Steve. When I wrote the Q I understood less the distinction between RG and the list it shows. I am still pretty new to this though. The list that displays in the RG is loaded in different ways, like “do a search for prompts marked as the user’s favourite” and other methods, so I think I still need to store (temporarily) what that list is, before I can navigate it in the popup?

What I mean is that it’s not always the same data source displaying in the RG so in identifying what Prompt goes up to the popup I think I have to send (in the CS) what the current list is as well, instead of only the index of the cell I clicked.

What do you think? My app is here if you want to check it out: Promptographer