Forum Academy Marketplace Showcase Pricing Features

Conditional arrows on Repeating Group

Does anyone know how can I show and hide the right and left arrows based on the visibility of repeating group cells? I know it should be simple but I just can’t figure it out.

Thanks in advance!

ezgif-2-390f7362fc29

Use a custom state to define a ‘scroll position’ for the repeating group, then have conditionals on the arrows to hide/show them based on the scroll position.

1 Like

Thanks @adamhholmes. Can you please elaborate a bit? Is scroll position a text/number state? Is a workflow populating it?

Sure…

There are actually various ways to achieve this kind of thing, some are simpler than others, but yes you’ll need to have a custom state (number) to define the scroll position, then use that to set the scroll position of the RG.

Run a simple workflow action to + or - 1 to the current scroll position custom state value when the arrows are clicked.

Set up your conditionals on the arrows so they are hidden when you reach the beginning or the end of the RG.

If you want/need to have an animated scroll then you’ll have to use a horizontal repeating group, but if that’s not essential then you can just used a fixed cell RG, then display items based on the scroll position.

If using a fixed cell RG, then you can set the datasource to be the desired list: items from ‘Scroll Position’.

If using a horizontal repeating group, use the workflow action ‘Scroll To Entry’ to go to the desired position, and check the ‘animate scroll’ option if you want the scroll to be animated.

The only slight complication arises when/if you also want to allow users to scroll through the RG using a mouse or touch screen device (as well as the arrows), as the actual scroll position won’t always be in sync the the custom state scroll position value. If that’s an issue for you then I recommend checking out the ScrollSpy plugin that will allow you to get the actual scroll position of the RG in real time, so you can ensure your custom state value is always the same as the actual scroll position.

But if that doesn’t matter too much to you then there’s no need to worry about that.

1 Like

Thanks @adamhholmes . This is very helpful.

1 Like