How can i display "Loading..." when repeater gets data
I have a data rep开发者_开发问答eater in ASP.NET page. It loads lots of stuff and its taking 4 - 5 seconds to display images. I can' t page or get a part of items i need to display all of the data so i need a loading message or gif but how can i do that? Can anyone help me?
Thanks
If your scenario is not ajax one (classic form postback or browser is redirected by link-click) I'd insert animated gif into html layout just before redirection / post back (hidden div is shown or something like that). AFAIK this approach will have problems with old-day-browsers (animation will be frozen)
Another approach is called page-processor?. Browser is redirected to intermediate page that shows animation while page requested is loaded.
You can also send javascript code from server (Response.Write / Response.Flush) that will animate your current page.
I also advise to block/hide UI control such as "send form" to deny impatient user click twice if server is responding too long.
Use an iframe. Essentially you can open a slow running page in an iframe and use the events raised by the iframe to display a loading image.
<script type="text/javascript">
var t;
//on iframe state change display or hide the loader tag
function readyStateChanged(state)
{
if (state == 'complete' || state == 4 || state == '4' || state == 'Complete')
{
//hide the loader
document.getElementById('loader').style.display = 'none';
clearTimeout(t);
} else
{
//diaplay the loader
document.getElementById('loader').style.display = '';
//hide the loader if the iframe never loads
t = setTimeout("hideLoader()", 5000);
}
}
//hide the loading tag
function hideLoader()
{
document.getElementById('loader').style.display = 'none';
clearTimeout(t);
}
</script>
<div id="loader" style="display: none;"><img />loading...</div>
<iframe id="frameX" src="your_page.aspx" width="100%" height="400px" onload="hideLoader();" onreadystatechange="readyStateChanged(this.readyState);" ></iframe>
精彩评论