By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
434,636 Members | 1,945 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 434,636 IT Pros & Developers. It's quick & easy.

"Loading message" while loading ASP.NET pages

P: 7
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..
Sep 16 '09 #1
Share this Question
Share on Google+
7 Replies


ssnaik84
100+
P: 149
this functionality is generally used with AJAX; if you want it in normal coding..

Expand|Select|Wrap|Line Numbers
  1. protected void Page_Load(object sender, EventArgs e)
  2. {
  3.    imgLoadingData.Visible = true;
  4.  
  5.    BindYourAllControls();
  6.  
  7.    imgLoadingData.Visible = false;
  8.  
  9. }
  10.  
for better look-n-feel, create a layer and after loading all data, hide it.
Sep 16 '09 #2

Frinavale
Expert Mod 5K+
P: 9,731
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):
Expand|Select|Wrap|Line Numbers
  1. window.onbeforeunload=showMessage;
  2. showMessage(){
  3.   var message = document.getElementById('<%=Message.ClientID %>');
  4.   if(message)
  5.   {
  6.     message.style.display='block';
  7.   }
  8. }
Sep 16 '09 #3

P: 7
I am using Ajax Toolscript Enabled website with master page.
Can you suggest how to implement this process in my site.
Sep 18 '09 #4

Frinavale
Expert Mod 5K+
P: 9,731
What's "Toolscript"?


Is your content in an UpdatePanel?
Does the content participate in asynchronous ajax requests?
Sep 18 '09 #5

P: 7
Yes my content are in UpdatePanel.
And contents participate in asynchronous ajax requests.
Sep 19 '09 #6

Frinavale
Expert Mod 5K+
P: 9,731
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:

Expand|Select|Wrap|Line Numbers
  1. Sys.WebForms.PageRequestManager.getInstance().add_beginRequest(ShowLoadingMessage);
  2. Sys.WebForms.PageRequestManager.getInstance().add_endRequest(HideLoadingMessage);
  3.  
  4. function ShowLoadingMessage(sender, args)
  5. {
  6.    var message = document.getElementById("<%=LoadingMessageLabel.ClientID%>");
  7.    if(message){
  8.      message.style.display = "block";
  9.    }
  10. }
  11. function HideLoadingMessage(sender, args)
  12. {
  13.    var message = document.getElementById("<%=LoadingMessageLabel.ClientID%>");
  14.    if(message){
  15.      message.style.display = "none";
  16.    }
  17. }
Sep 21 '09 #7

P: 7
Thanks it worked for me..
Sep 22 '09 #8

Post your reply

Sign in to post your reply or Sign up for a free account.