Hiding spinning icon in APEX 21.1 Modal Dialog

APEX Office Print (AOP) APEX Office Print (AOP)

Saturday, July 24, 2021

An AOP customer wrote us that when opening a PDF in a Modal Dialog, the spinning icon didn't disappear automatically anymore in Oracle APEX 21.1, whereas it did before.  


I created a use case but saw it affects not only the AOP process but any file you want to open in the Modal Dialog. With previous versions of APEX, this didn't happen, but with APEX 21.1 the Modal Dialog keeps showing the spinning icon.

Here's an animated gif that shows the use case:
I created two use cases; both buttons redirect to a modal page in the app.

On the modal page behind the "View File" button, there's a before header process which gets a BLOB (PDF) from the database and displays it inline.


On the modal page behind the "AOP Modal" button, there's a before header AOP process which generates a PDF of a classic report on the fly.



To work around the issue, I added a dynamic action on the page where the buttons are defined; on click of the button, it will execute the following JavaScript code:

setTimeout(function(){ 
  $('.ui-dialog--apex.t-Dialog-page--standard .ui-dialog-content').addClass('js-dialogReady');    
}, 2000);

After waiting 2000 milliseconds (2 seconds) it will add the js-dialogReady CSS class, which tells the icon to hide.


Hope it will help you in case you need to remove the spinning icon from your modal dialog.
Picture of Dimitri Gielis

Dimitri Gielis

Founder and CEO

Passionate about bringing ideas to life with code. Founder and CEO of United Codes and APEX R&D. Loves the Oracle Database and Oracle Application Express (APEX).

Comments

No comments yet, be the first one to let us know what you think of this article!