Problem with setting focus after displaying a modal

Question

I have an Oracle Apex application that has an input field and some buttons.

The workflow is:

User enters text, presses enter. The screen changes to a different "page" that does not have the input field on. The user presses a button that posts a modal dialog. The user closes the dialog. The screen returns to the original screen with the input field.

The focus remains on the button that triggers the dialog. I would like to re-focus on the input field. I have tried a lot of variations on the following:

 apex.item( "XXXX" ).setFocus();
 setTimeout(function() { apex.item( "XXXX" ).setFocus(); console.log($(":focus"))}, 5000);
 setTimeout(function() { $( "XXXX" ).focus(); console.log($(":focus"))}, 5000);

None of these set the focus, it remains on the button. What is interesting is that if I click in the field to focus it manually, then click off so that it is no longer has focus, the setTimeout version of the code above will set the focus to the input field. So it seems like something is making it not "know" it can be focussed.

Has anyone seen anything like this behaviour? I don't think the fact that it's an Apex application is too relevant, it's in the javascript layer that the issue lies. I see the same behaviour running the code in the console.

Maybe your page is constantly reloading because of some error or loop ? You may check in that area to find out the actual issue — Dani
– Dani, Commented Aug 7 at 12:51
It is not constantly reloading. I've checked in the dev tools. — Greg Reynolds
– Greg Reynolds, Commented Aug 8 at 8:40

Koen Lostrie · Accepted Answer · 2025-08-10 12:31:33Z

1

There is not enough data to reproduce the issue. The description is the user experience, not the APEX implementation of the business logic. Hard to say what could be wrong without knowing any of the implementation details. So here are 2 guesses...

I did a quick test on the emp table:

Create an interactive report with a form (type drawer, which is a modal dialog) through the create page wizard.
Add a page item P310_MYPAGEITEM on the report page
Add a true action to the "Close Dialog" dynamic action on the report page of type "Set Focus" for P310_MYPAGEITEM.

Ran the page, clicked on an edit icon for a row, made a change and clicked "Apply Changes". The modal dialog closes and the focus is set on the page item.

The above scenario is the most common way of using modal dialogs in APEX:

Dialog is invoked from report page by clicking on a link
Dialog is closed in the dialog page by a page process of type "Dialog Closed" which allows the report page to capture the close event and act on it through a dynamic action.

The APEX architecture allows for other ways of working with modal dialogs. If the modal dialog is closed by using a branch that redirects to the calling page then the calling page will be reloaded on close of that dialog. In that case, a solution is to use an addition page item on the calling page (P310_FOCUS) setting the value in the branch from the dialog page - for example set it to YES in the branch). Then in the calling page, create a dynamic action on page load with a client condition of "item = value" on P310_FOCUS = YES with a true action of focus.

If the above suggestions do not help, then please update your question with a detailed step on how to replicate your implementation.

edited Aug 10 at 12:31

answered Aug 9 at 12:58

Koen Lostrie

19.5k2 gold badges16 silver badges25 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Greg Reynolds Aug 13 at 9:31

Thanks for getting into that. It's very hard to share test cases for Apex on here, the application is not really "massive" but still quite unwieldy. The fact that I got the same behaviour when just invoking javascript in the console suggested that the problem wasn't exactly Apex specific. The page in question has a lot of custom javascript, so it's hard to tell where the standard Apex ends and our code begins.

Koen Lostrie Aug 13 at 9:53

Anything APEX specific that is client side can be executed in the console - so what you're seeing does not mean it's not APEX specific. How is the dialog closed ? A "close dialog" page process or a branch ? That determines if the close event can be captured

Greg Reynolds Aug 14 at 15:37

What I was meaning what that i was just using the browser API e.g. window.setTimeout(function() { document.getElementById('myInput').focus(); },100); I dug through all the places where I was closing a dialog and put that snippet everywhere and that did seem to fix the issue. So the problem was that the Apex set focus action was not doing what I would have thought it should

Greg Reynolds · Accepted Answer · 2025-08-14 15:39:34Z

0

The fix was putting a javascript snippet

window.setTimeout(function() { document.getElementById('myInput').focus(); },100);

Instead of using the Focus action. I guess the timing is complicated when there are a lot of dialogs in an application.

answered Aug 14 at 15:39

Greg Reynolds

10.5k15 gold badges53 silver badges63 bronze badges

Collectives™ on Stack Overflow

Problem with setting focus after displaying a modal

2 Answers 2

3 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related