Thursday, February 25, 2010

Apex page with Animated "Loading" modal window

For some time I was trying to find a way so when you open a page in Apex it will show animated "Loading..." screen (in modal window). I was able to fine a solution but the solution was based on havind pre-loading modal screen for reports region. Finally, I've fond this thread : http://forums.oracle.com/forums/thread.jspa?messageID=4126932#4126932

posted by Cedwards and here I am going to describe his idea. First of all please see these 2 pics, the first one is the actual loading screen



and the second one is when "all over".

Anyways, by using ExtJS (http://www.extjs.com/) and downloading their files to your workspace:
- loading_large.gif
- ext-base.js
- ext-all.js
we can Achive this.
1. let's assume that ExtJs files listed above donloaded and uploaded to your workspace.
2. Go to your page for which you want to have "Loading" window and create and create "No Template" HTML region with Display Point "After Header" and Sequence #1. In Region Source paste this:
 
Loading...
3. Added another page zero region (after header and a sequence of 2.) with the following code:
 
 
 

That is it, we are all done