In this blog post I discussed how the processing message can be shown when we have a page process that may take a while to process.  Sometimes the delay may occur when the page is being rendered.  We may not want the user to begin doing anything on the page until the whole page is loaded and rendered.

This can be done by calling the apex.widget.waitPopup() function.  Edit the page definition and add javaScript to call the function to the Header Text.  

<script type="text/javascript">
  apex.widget.waitPopup(); 
</script>

We add it to the header text in hopes that the waiting functionality will be executed early in page rendering.

Once our page is loaded we need to remove the loading bar and enable the page.  In the page definition we can add some code to the "Execute when Page Loads" field of JavaScript section.

$(window).load( function() {
  $("#apex_wait_popup").remove();
  $("#apex_wait_overlay").remove();
});

Demo

5.0 Update (27-APR-2015)

APEX version 5.0 added an additional element for the popup.  Add the following additional line to the Page Load javascript code:

$(".u-Processing").remove();

5.0 Update (04-MAY-2015)

My pages were at times still not removing the new spinning arrow graphic that was introduced in 5.0.  Changed the header text to:
 
<script type="text/javascript">
  var pageloadWait apex.widget.waitPopup(); 
</script>
Then in the execute when page loads sections only add one line javascript call.
 
pageloadWait.remove()

 

 

*** Please use at your own discretion.  The only apex.widget function included in the documentation is apex.widget.initPageItem(pName,pOptions).  The function described here is not documented (as far as I can tell) and may be changed at anytime.

 

( Oracle Application Express (APEX) 4.2.4, 5.0 )