274
Views
3
Comments
Reactive accessibility set focus issue
Question
Application Type
Reactive

There is an application I am working on where there is a need for accessibility functionality. I would like to use the SetFocus action to all of the screens within the application. This is ok apart from where there are one or more web blocks within a screen. I have tried using the SetFocus action within the OnReady event or OnRender event within the web block but this does not work. How do you set focus to an input widget within one or more web blocks within a screen?

2021-09-06 15-09-53
Dorine Boudry
 
MVP

Hi Andrew,

One of the things I can think of, is that you are trying to set focus to things that are inside an If DataFetched.  These are not part of the DOM yet at the time of OnReady, so you can't set focus to them in that event.  

In that case, I think you'll have to set the focus in the first render after the data is fetched.  See attached oml demonstrating this.  I tried to do it in the OnAfterFetched event, but that is still too early, as you can see in my demo oml.

Screen 2 is showing this problem, screen 1 and screen 3 don't have the input inside an If, and work out of the box.

Is this the case for you, or can you share an oml demonstrating what your exact use case is ?

Dorine

QDR_BlockSetFocus.oml
UserImage.jpg
Andrew Hudson

Hi Dorine 

Thanks for the reply. 

Well in my application I have a wizard ,for example, which comprises of a screen. Within this screen there is a web block and within that web block there are several web blocks - each one presented to the user depending on what navigation item is selected. I am trying to use the  SetFocus action  within each one of these web blocks in an event (I have tried OnReady(), OnRender() and OnAfterFetch() but no luck. In some of the web blocks I 'm not waiting for data I just need to set focus to an input box but I cannot do this. 

2021-09-06 15-09-53
Dorine Boudry
 
MVP

Well yes,

that´ s a variation of my example.  The problem lies in the fact that visibility (and as a consequence the presence in the DOM) is not there at the time you try to do the setfocus.  So the place to do it is in the OnRender, and you´ ll have to limit that to only once, the first time that particular block becomes visible.

So let´ s say you have some boolean to regulate visibility of webblock x, maybe as an input parameter, you´ ll  have to have a second local boolean ShouldSetFocus, that is for example set to true every time the IsVisible becomes true ( in the onParametersChanged) and set to false again in the OnRender after setting the focus.

Dorine

Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.