"Loading message" while loading ASP.NET pages

[saurabhsingh]

Can anyone plz suggest any Idea that How to implement "loading message" in a site with master pages.
I am having Default page which is master page enabled and it contains many Gridviews with database connection.
This page is taking so much of time to load therefore I want to show loading message for this page only.

Thanks in advance..

[ssnaik84]

this functionality is generally used with AJAX; if you want it in normal coding..

protected void Page_Load(object sender, EventArgs e)
{
   imgLoadingData.Visible = true;
 
   BindYourAllControls();
 
   imgLoadingData.Visible = false;
 
}
 

for better look-n-feel, create a layer and after loading all data, hide it.

[Frinavale]

This is going to have to be implemented using JavaScript (not C# as ssnaik84 as suggested).

How this is implemented depends on whether or not your page is using Ajax. If it's using Ajax (UpdatePanels) then you could display the message when the PageRequestManager is in it's beginRequest event...then hide the message when the endRequest event occurs.

If you aren't using Ajax then you should just display the message during something like the onbeforeunload event.

Displaying the message is pretty easy.
Just add an ASP.NET Label or Panel to the page and give it a style="display:none"...then in the JavaScript change the style to display:block.

Eg (only works with no Ajax):

window.onbeforeunload=showMessage;
showMessage(){
  var message = document.getElementById('<%=Message.ClientID %>');
  if(message)
  {
    message.style.display='block';
  }
}

[saurabhsingh]

I am using Ajax Toolscript Enabled website with master page.
Can you suggest how to implement this process in my site.

[Frinavale]

What's "Toolscript"?


Is your content in an UpdatePanel?
Does the content participate in asynchronous ajax requests?

[saurabhsingh]

Yes my content are in UpdatePanel.
And contents participate in asynchronous ajax requests.

[Frinavale]

First you need to add a label to the page with the Loading Message. Set the style of the loading message to display:none so that it is hidden on the page until you want to display it. Write a JavaScript method that can be called to display the message (it should set the label's style to display:inline or something to show it) and another method to hide the message (it should set the label's style to display:none).

You should call these methods when the PageRequestManager is beginning the Ajax request and ending the Ajax request. You do this by grabbing a reference to the PageRequestManager and then indicating the methods that should be executed using the add_beginRequest and add_endRequest methods.

For example, say your JavaScript methods to show and hide the message were called "ShowLoadingMessage" and "HideLoadingMessage", you would use the PageRequestManager like:

Sys.WebForms.PageRequestManager.getInstance().add_beginRequest(ShowLoadingMessage);
Sys.WebForms.PageRequestManager.getInstance().add_endRequest(HideLoadingMessage);
 
function ShowLoadingMessage(sender, args)
{
   var message = document.getElementById("<%=LoadingMessageLabel.ClientID%>");
   if(message){
     message.style.display = "block";
   }
}
function HideLoadingMessage(sender, args)
{
   var message = document.getElementById("<%=LoadingMessageLabel.ClientID%>");
   if(message){
     message.style.display = "none";
   }
}

[saurabhsingh]

Thanks it worked for me..