Forum Academy Marketplace Showcase Pricing Features

Event that tells you have reached the end repeating group while scrolling

For UX reasons I believe I need an event to tell me that the user has reached the end while scrolling a repeating group.

Is there an event, that triggers if the user has reached the end?

Are you using ext. vertical scroll? If so, you could place a text element beneath the repeating group in the page’s editor which notifies the User that have reached the end. Or are you trying to have the app notify your account that a User has scrolled through all of the entries?

2 Likes

Thank you.

I am displaying X number of items in the repeating group with regular vertical scroll. When the user reaches the end of content, lets say item 25 I was hoping I can have an event fired telling me the user has reached the end of the list. At that point I will load the next 25 items.

I find the tradition approach of buttons saying LOAD NEXT 25 as bad UX. Just my preference.

Assumption: I assume that if I have 1000 items that I need to break it up into searches of smaller amounts. However, I am uncertain if Bubble takes care of this and loads items dynamically, in which case, I would not have to worry about this at all.

Please advice. Many thanks…

Ohhh, got it. One way would be to place a text element (“you’ve reached the end”) within the repeating group cell at the bottom (not visible on page load). Then create a conditional statement which is “When current cell’s index is RepeatingGroupListofThing’s:count” --> This element is visible [checked]. This would display the text element only in the last entry’s cell, notifying the User that they’ve reached the end. Would that solve it?

*You can place the text element in a collapsible group so that there isn’t an odd empty space in the cells where the text element isn’t visible.

1 Like

I think I misunderstood you’re question. Are you saying that you’re trying to display X amount of entries to the User, and then once the User reaches the end, you want to display Y more entries in that same repeating group with regular vertical scrolling?

Load more data when the scrolling position is greater than the value of repeating group’s cell’s height multiplied by the length of the repeating group’s list.

ou want to display Y more entries in that same repeating group with regular vertical scrolling?

Yes, exactly…

Is my assumption correct, that bubble will not do this automatically. I am afraid that if I look for all matching records 1000+ and display 10 visibly that it would take a long time to load. Correct?

Bringing up with @fayewatson mentioned earlier, is an ext. vertical scrolling (not vertical scrolling) repeating group what you are looking for? If not, my solution earlier should achieve what you want; although, I haven’t tested it out myself.

1 Like

I’m not 100% sure, but I think that would take a long time to load when using regular vertical scrolling. And going from 10 entries to 1000 would make it a little difficult to use the scroll bar, since that would continue to shrink as the User scrolled down. Like @Scott said, I think ext. vertical scroll would definitely be best to use (I believe that loads the entries as they become visible). Then you can calculate when to display more results using Scott’s method should the User reach the end of the ext. vertical scroll results. Or, place another ext. vertical scroll directly below that repeating group containing the new search. (I also haven’t tested this approach before)

2 Likes

Thank you both so much, I am going to play around the integrated solution presented here.

I just seemed like bubble was loading things as you go. Still not sure if that is the case. However the diminishing scroll bar would be a problem for sure that I had not considered.

Does the extended scroll add items as you go so that the initial server query does not return all items but rather are requested from the server as you go?

Scott, I can find the scrolling position of the page but not of the repeating group. Where do I find the scrolling position of the repeating group? Thanks in advance.

I’m almost sure the extended scroll loads items as they become visible. For scrolling position, you would manually enter the number from @Scott’s suggestion in the Do When Condition is True event:

Thank you will try. But isn’t that for the scrolling position of the page and not of the repeating group?

No prob :slight_smile: Correct - because you’re triggering the event when the User reaches the end of the repeating group? That’s why Scott recommended to multiply the amount of results by the repeating group cell height to get the page scrolling position number (or close to it)

But my repeating group is not the extending type so the scroll position of the my page stays at zero no matter where the scroll of the repeating group is positioned. The current scroll position of the page is always 0.

See what I mean?

Ohh, right - yes that method would only be for ext. vertical scroll. I don’t think you can trigger the event from reaching the bottom of regular vertical scroll currently.

1 Like

Thanks @fayewatson and all for your help. I think I am going to suggest this.

RepeatingGroup Current Scroll Position (returns pixels)
RepeatingGroup Scroll At Start (returns yes/no)
RepeatingGroup Scroll At End (returns yes/no)
or
RepeatingGroup Scroll Percent (returns number 1-100)

For extra crispy UX

1 Like

No problem at all and sounds good :slight_smile: (extra crispy UX, I like it!)

This topic was automatically closed after 70 days. New replies are no longer allowed.