Hi there,
I have a listing screen as shown in the below screenshot. It is using the List widget. When I click on the one of the items, it will navigate me to the detail page and when I click back button in the detail page, it navigates back to the listing screen but the scroll is always at the top and not from the item I had navigated. However, this works as expected by going back to the exact scroll position in my personal environment but not in my work environment.
Also I have set previous screen and reverse transition in both the environments. Service studio version is same for both my personal and work environment.
I would highly appreciate if someone could give a solution at the earliest. Thanks!!
Thank you all for the responses. Retaining scroll back position is available by default in latest OutSystemsUI. It was working for me when I updated. Till then I was using the below workaround by using Javascript on the client action which is navigation to another screen.
While navigating back the previous page, the below was done
Diyab, can you show where and how you gave the 'inpRowNo' input parameter its value?
Hello Diyab,
Check the MaintainScrollPositionOnPostBack property setting of the pages in the application in your work environment.
To work it must be set to MaintainScrollPositionOnPostBack = true
There are three ways of applying the property to a web page.
You can set it programmatically
Page.MaintainScrollPositionOnPostBack = true;
In the page declaration
<%@ Page MaintainScrollPositionOnPostback="true" %>
Or in the web.config´s <system.web> section.
<pages maintainScrollPositionOnPostBack="true" />
Hi Huarlem,
Thanks for the info. Please may I know where I can check the web.Config? Do I have to download Factory configuration component from Forge?
Yes, I never did this configuration, but from what I've seen here in the forums this component does the necessary work.
See these posts;
https://www.outsystems.com/forums/discussion/14650/how-to-trigger-the-factory/
https://www.outsystems.com/forums/discussion/60471/how-to-setup-the-web-config-file-to-send-http-security-headers-to-your-app/
Dear Diyab,
Another solution would be setting the clicked rownumber in a client variable and use something similar to this in the onrender of the screen
setTimeout(function(){
var elem = document.querySelector("tr:nth-child("+ $parameters.Rownumber+")");
if ( elem !== null ) {test.scrollIntoView({behavior: "smooth"});}
}, 500);
The timeout function is needed since react can take sometime to render.
The rownumber parameter is the one you want to scroll to.
I use something like this in one of my applications.
Kind regards,
Alexander