I’m trying to accomplish a pretty simple task that I’m suprised still isn’t a native feature of Bubble:
I have a page with an infinite repeating group. When the user clicks on an item it goes to a new page for that item. If the user clicks the “Back” button on their browser to return to the repeating group, I want them to be able to resume in the same position they left off.
Currently if the user returns to the original page they are taken to the top. This can be very frustating when you are doing something such as shopping. Imagine on Amazon if everytime you hit “Back” from a product page you went to the top of the search page instead of where you left it.
I’ve read everything written on this and there doesn’t seem to be a solution. Am I missing something?
Hi there, @brandon8… I did something in one of my apps that is similar to what you have described, and while it might not be the best way to go (maybe someone can clue us both in on a better/easier way), I didn’t think it could hurt to throw it out there as food for thought.
In a nutshell, you could have a field on the User data type where you save the the scroll position of the page with the infinite repeating group any time the user clicks on an item to go to a new page. Then, you would have a workflow that runs on page load of the page with the repeating group that uses the Run javascript action from the Toolbox plugin to scroll to the position that was saved to the field on the User data type.
Again, that certainly might not be the best way to go (who knows, it could possibly be closer to the worst), but it did work for me, so maybe it will work for you, too.
Yup… didn’t realize your users might not be logged in (although, I probably should have been able to anticipate that based on how you described it… my bad).
This wont be too helpful but It’s worth letting you know that when I click back on the browser my app it automatically brings them back to the same position they where at on the previous page. So maybe you have done something to interfere with the function?
I just realised that is also worth noting is that my app is a one page app that hides and shows elements based the url, so im sure that could possible have something to do with it and why it is working for me.
You can store values in the URL as a parameter. If when a user clicks to go to another page, you capture the scroll position and send that in a URL parameter to the same page just before you navigate them to the new page, it will put the URL parameter in.
When using the go to page workflow action to send a URL parameter the change to the URL is almost instantaneous, the page doesn’t reload or anything and it should be fast enough to get that scroll position value into the URL parameter before then sending them to the next page. This way when they hit back button on browser, the URL parameter will be there and you can run a page is loaded workflow to extract the URL parameter to then scroll to that position of the URL parameter. This is similar to why @bkerryk gets the function he has of showing the same view based on the URL parameter.
You can also use @mikeloc suggestion, because as far as I am aware, Bubble stores cookies for your users up to 72 hours when they are not logged in or registered, so any data entries they create while not logged in are still tracked to them as a user for up to 72 hours. This is how the ‘created by’ field gets populated with the correct user if the user was not registered when making an entry to the DB but within the 72 hour window registers.
So one follow up on this, I’m come to realize that the page I’m wanting to save the scroll position on has a infinite scroll RG. So the problem is when I go back that old position way down on the page doesn’t exist because those rows are no longer loaded.
Any workarounds you can think of that for or do I just need to bite the bullet and build in page pagination?
probably easier to build in pagination as you could also send into the url parameters on the page number it was on so as to auto load the rg to that particular page. Or could maybe set things up to know which items in the rg are in view at time of navigate and send in the ids of those things to then scroll back to those things.
Ahh yes, that last line is a great idea. I’ll look into that. Paged results feels so old-school to me. I like the idea of the user being able to endleslly flow like they do on social networks, but I understand that can potentially come at a cost when the user clicks back and now Bubble is forced to load potentially hundreds of items at once in order to get the user all the way back down the results.
