I'm currently working for a client on a reactive project and the team has been having issues when content is dynamically loaded (ex: multi-step process with show / hide containers).
After a long time trying to figure it out I found out that if the page has an alert pattern that is not visible on the page without scrolling the page or if it's a container with scroll will scroll automatically to show the last Alert pattern present on the page.
Has anyone had this issue?
Is there a fix without creating a custom pattern?
Thanks in advance.
Hi Mario,I have not had that issue yet, but also haven't used the Alert Pattern a lot.Could you set up a quick oml where this issue occurs so I can have a look?
Actually looking closer to the OutsystemsUI Patterns, the Alert Pattern includes a SetFocus action that will set focus to the Alert Pattern widget, thus causing my reactive application to scroll to make the last Alert on the page visible.
I have suggested an update to the pattern where this SetFocus action should not be mandatory.
Please use the link below to vote on this improvement:
https://www.outsystems.com/ideas/11538/add-a-parameter-so-the-setfocus-action-on-outsystemsui-alert-pattern-is-not-manda/
Hi Mario,
I can understand the original intention, why this SetFocus is part of the pattern, when you want to alert people, you need to make sure they see it. So yes, maybe a parameter to steer this behaviour would be nice.
As ideas have a way of taking some time (if ever) to get implemented, there is a way you can work around this SetFocus, but whether it can be applied in your use case, I can't tell, you'll have to see.
See attached OML, i compared 3 ways of making it conditionally visible, an If widget and the visible property of a container cause a scroll, using display:none CSS doesn't.
I'm thinking that is because in the last case, it is already part of the DOM, even if it's not visible. That SetFocus probably only happens at time it gets added to the DOM, and not in case it is display:none.
In case an out-of-view alert could also be visible on initially loading the page, I added an extra IsReady boolean that gets set in the OnReady event, otherwise it would still scroll into view when loading the page initially.
Dorine
Hi Dorine,
Thanks for sharing. Your OML works perfectly to understand what triggers the SetFocus.
When I use an Alert, although the intent of the pattern might be to ensure the user sees that message, I might just need to highlight a particular message rather than force the user to see it.
I also found that, since I am developing patterns for other developers to use, it's better to create a custom pattern based on the Alert pattern but without the SetFocus option, rather than asking other developers to use control variables just to prevent the page from scrolling.
Meanwhile this is a rather quick fix if someone wants to include it on the roadmap for OutsystemsUI. Simple input parameter and an If statement.
yes,
agree that custom pattern that does exactly what you need is the way to go, if it is going to be used by many developers.
I was responding to the question for a fix without creating a custom pattern in original post.
good luck with it,