Load more data in a Repeating Group when user scrolls

Hello everyone,

I’ve been searching this forum for hours and couldn’t find a clear reply about what to do.

So I’m building a Chat feature (like many users can join the chat at the same time).

Right now it takes almost 10 secs (on mobile) to only load 75 messages so I need to find a way to make it faster. I’ve read that we can create it so when a user scrolls, it loads more messages. I’ve set the RG to only show the latest 15 messages. I just cant figure out how to do the “loading on scroll”.

Is there another better alternative to make a Chat function really fast even if it has 1000+ messages?

Thanks for the help !!

2 Likes

Hello @ben4trader how are you?

Consider creating a button for your user with the option “Load more messages”.

Once the user clicks on the button it will add the repeater group list to the current list plus the amount of messages you want. The new list count must start from the current list position + 1.

When I go to do Chats works perfectly for me.

I hope I was helpfull.

2 Likes

Hi i’m very good! I hope you’re well too :slight_smile:

So yes and no, ideally I’d like to have it so user scroll and it loads oldest chat. I’m getting really close to what I want to achieve.

I got a plugin that gets the position of scroll and when it reaches 0, it triggers a workflow to get more messages.

I’m just down to 1 issue now : this only works flawlessly once. The problem is that it autoscrolls to the top of the new messages so my scroll value stays at 0. What I’d like is that the screen stays as it is when new messages get added so the scroll value wouldnt be 0. This way, another scroll top until value is 0 would trigger a new set of messages… I dont know if i’m clear lol !!!

Is there just a way to make it so when we add more messages to load in the RG that it doesnt auto scroll to 1st entry ??

1 Like

@ben4trader I normally use JavaScript to do this interaction, I remember that only with the bubble I had this same problem. you will need to pass the scroll element itself to the code for it to always calculate the size. when the button is pressed the size is automatically changed. in your case a scroll to top is not necessary, because then it will load more messages but it will stay in the same position.