Show a Waiting Image While Page is Loading

  • Thread starter Thread starter WB
  • Start date Start date
W

WB

Hi,

I have a web form that takes a long time to load. It inherits a master page
which has several ContentPlaceHolders.

Now these slow components (mostly databinding to GridViews) are in several
of the ContentPlaceHolders on the web form. I could use a UpdateProgress
control for each of these slow components but I don't want to have several
"waiting images" all over the page. Can I just not display the page at all
but show only ONE waiting image in a white background, and load the page as a
whole when all things are ready?


Thanks,
WB
 
place the image on the page, and every thing else in a div with display:none

then in window.onload or document.readystate make div visible
 
Hi, thanks for the reply. Did you mean place the image on the master page?
And have all the ContentPlaceHolders in a <div> with display:none in the
master page too?
 
WB said:
Hi, thanks for the reply. Did you mean place the image on the master page?
And have all the ContentPlaceHolders in a <div> with display:none in the
master page too?
Click to expand...


you could do that i think

anouther and better way is to not download the slow datya till the page is
loaded.

I have done this on this page, on the far right you will see a list of most
visited pages, it can be slow, so i downb download it till after the page
has finished loading
http://wanews.org/

you can do this with ajax or do it yourself I have an example here
http://dev.thatsit.net.au/samples/aspnet/postback/default.aspx
 
Hi, I did try to put the waiting image in the master page. However, because
the web form is loaded before the master page, the waiting image is displayed
very briefly only AFTER all the processing is done. That defeats the whole
purpose.

I saw your example on http://wanews.org/. It is similar to what we have
right now, one UpdateProgress control for EACH slow component. But what we
would like to achieve is halt the loading of the ENTIRE page until all these
components are ready. In the meantime, one single waiting image is displayed
in the middle of a completely white background. Then when all components are
ready, the whole page will load at once...
 
WB said:
Hi, I did try to put the waiting image in the master page. However,
because
the web form is loaded before the master page, the waiting image is
displayed
very briefly only AFTER all the processing is done. That defeats the whole
purpose.

I saw your example on http://wanews.org/. It is similar to what we have
right now, one UpdateProgress control for EACH slow component. But what we
would like to achieve is halt the loading of the ENTIRE page until all
these
components are ready. In the meantime, one single waiting image is
displayed
in the middle of a completely white background. Then when all components
are
ready, the whole page will load at once...
Click to expand...


I suggest you look at the second sample i sent, using call backs.

you can load the page, without the data, show the image, then call the other
data using a call back.
the draw back is that you have to pass a string back to the clint
javascript, rather than access .net controls.
but if your good with html strings you can then use innerHTML to insert your
data where you want it.

thats what i have done on the first page.
I have only done it on a small section but I could of done it for the whole
page
 
Back
Top