Can I make an app give a "loading..." message or animation?

Hi. I have an important app that loads as the default app in my main menu. Unfortunately, the server can often take a few seconds if it is busy, so my users only see a menu with a blank frame under it, till the app loads (it is a grid with graphic images in certain fields).

Anyway, my question is, how can I display a modal window or centered div that says “loading…” OR use an animated GIF that shows something is happening, before the app loads the grid records on the screen. After it loads, I want the message to be invisible.

Thanks for any ideas :slight_smile:

Hi Onmountain,
Yes you can use a “Loading…” message in scriptcase. Please follow these steps:

[SIZE=5]Example to show a Loading message[/SIZE]

  1. Set a PHP variable with a DIV. Here you can use a GIF animation or text.
[head_loading]='<div id="loading">Please wait</div>'; // This is the DIV message
  1. Set a PHP variable and CSS to hide your #loading div.
[footer_loading]='<style>#loading{display:none;}</style>'; // Hide your DIV using CSS
  1. In your application->Layout->Header, put your [head_loading] variable.
  2. And finally in your application->Layout->Footer, put your [footer_loading] variable.

Note: If your server runs slowly the application will show your div with a ‘Please wait’ message.When your page loads completely will hide your loading DIV, because its the last part of your application. If your application is loading data using AJAX this will not work.

Brilliant - thanks

Hello hirambq,

Sounds great but I’m not sure where to put that code. I tried putting it in the onheader and onfooter events but that didn’t work. Then I tried putting the code in a php method and the globals showed up that way too but nothing happened again. What should my settings on the globals be? I want there to be a blank screen with the ajax loading animation that is available with scriptcase and not in the header. I guess what I need is a blank PHP with the loading animation that redirects to my form after it loads. I’m not the best at programming so a little direction would be appreciated.

Hi ancr2001, in my case, i have one treemenu and from here call others objects in iframe mode. In Applicationinit’s event i declare (like hirambq say above):

[head_loading]=’<div id=“loading”>Please wait</div>’; // This is the DIV message
[footer_loading]=’<style>#loading{display:none;}</style>’; // Hide your DIV using CSS

Then, in the Onexec event i make one echo:

echo [head_loading];

With this i display one message: “Please wait…”

In the obect called, in the Applicationinit event i make one echo:

echo [footer_loading];

And, for me is working, if you like to try.