Collapse repeating group when RG has fixed number of cells

Hi guys, I’ve been fiddling with the “Fixed number of cells” RG and can’t seem to figure out how to collapse it when there is an insufficient number of cells. My intention is to list only 12 items on page load and use pagination to display the next 12, however, I’ve realised that there is a MASSIVE and very much confusing gap (having an adverse effect on the UX) when the maximum number of cells are not displayed. For example, rather than there being the maximum 12 cells, when there are 8 cells shown, the full height of the repeating group still displays as if there are 12 cells. Users are often baffled when seeing this as it makes it seem as though there is no pagination, when in actuality there is - the pagination group/RG is just way below the fold because the missing cells have not collapsed.

Is there anyway to collapse this for the purpose of pagination?


Bumping this up


Does “Full List” do it?

I’ll give this a try. Correct me if I’m wrong, but I’m pretty sure that pagination only works with and RG that has a fixed number of cells.


I haven’t noticed that in any of the reference, or manual descriptions, but it’s worth a try.

I am very much in need of a solution for this as well. I have posted this in another thread previously and have been scouring the forum for a solution but none seems to exist.

I am also have problems when the page width shrinks the repeating group results won’t fit all of the fixed number of cells as the repeating group height is not tall enough when there are enough results that the smaller viewer width makes the R.G. have less rows than made in editor ( ie: editor is 4 rows but smaller screen width makes only 2 rows )…the total results is 12 but only 8 are displayed as the R.G. height doesn’t expand.

I know I could create separate groups for all the different possible widths and row combinations but I’d rather have the responsive settings allow me to make just one page that works on all screen widths.

Another issue is that the footer of the page is not able to be responsive since the page height is not responsive.

1 Like

Here is an answer for anybody looking as I had to

1 Like

I’ve been ignoring this problem in my app for the past 3 months. Today I decided to tackle it, got lazy when I scanned the number of answers and links…

So I devised a dirty solution. I haven’t done extensive testing, but I thought to share the idea here (as a note to my future-self).

My solution was to create 2 repeating groups.
[dodges tomatoes thrown by the crowd]
Hold on, hold on! Hear me out.

  1. I duplicated the original repeating group. So now I have the og-RG and the new-RG.
  2. create new groups, containing each RG.
  3. both group are set to NOT be visible + collapse when hidden.
  4. the og-RG-group has a visibility rule that if the contents are greater than 10, it’s visible.
  5. the new-RG-group has the opposite (actually, to be precise it’s equal or less than 10).
  6. the new-RG is set to Layout style: Full list.

It works so far.


So, I’ve learned a few new tricks in the meantime. The above solution is a bad solution.
[throws tomatoes :tomato: at past self]

Just use @keith’s List Shifter.

I’ve made a few videos of me untangling the mess I created and replacing with List Shifter.

Refactoring Bubble


I’ll have to check that out! Thanks for building out some fresh content about List Shifter! :ok_hand:

1 Like

Thanks @rico.trevisan taking time to post here and also for the videos explaining how it works. It really helped.

I have been avoiding List Shifter for long for the fear of having to learn another thing, and also didn’t know it could be helpful in this context.

And thanks @keith for creating the List Shifter.

1 Like

One caveat in using list shifter though which probably should have been called out here and in documentation (or maybe it is called out but I missed it) is that one needs to wait for the “initialised” state of the list shifter element to do operations on it.

I was doing a “go to page” operation on list shifter element. It was working in test setup, but not in production. In production setup, the list shifter was going to page 1 even though I wanted it to go to page n.

After breaking head for over an hour, I by luck figured out that element was not getting initialised, and that was causing this behaviour.

But now I am wondering that if the code has to wait for initialisation of this element, is this SEO friendly?

1 Like