Ajax update panel image while updating
A Timer control outside a panel can cause the Update Panel to be refreshed if it is configured as a trigger for the panel.
Here Mudassar Ahmed Khan has explained how to display loading GIF image or progressbar while page is loading or during postbacks using j Query and Java Script for long running tasks or processes which require significant amount of time to execute.
Of course, I hope you can make it all look a little prettier than what I threw together for this post!
To do this, you can add the following Java Script This Java Script allows you to add Java Script code that will process during the initialization of the postback – a perfect place for us to grab the information we need.Here’s what the complete code looks like: The exact implementation isn’t that important – what I think is important is that you can hook into the Page Request Manager to invoke some Java Script. Threading to make the button click sleep for two seconds: Okay, now to test.Here’s the page prior to the postback: Once the page is clicked, the experience changes to the following while the server is processing the request: And yes, this works in Firefox too: As I mentioned before, the “blur” and “progress” controls act as a screen over all the other controls, and since they are part of the Progress Template these controls they are only active during server processing.You can use the Update Progress control alone with the Update Panel to provide a message to the user during the postback.This is very simple – put the Update Progress control within the Update Panel like so: This will display the “Update in progress.Hi, We can use it but the challenge to hide the controls on the page.User will click on any ontrols if we use Update Progress. NET AJAX uses an Update Panel control to support partial-page updates; essentially, controls contained within the Content Template property can be updated without refreshing the entire page. NET Web Form also contains a Script Manager control which allows the Update Panel to participate in partial-page updates without requiring custom client script code.The server sends back HTML markup for only the affected elements to the browser. NET 3.5 and Visual Studio 2008 is that you don’t have to install anything else in order to build ASP. Now, if it takes awhile for the server to process the postback (e.g.To provide the functionality we require, we need to use the following CSS elements: The purpose of the “blur” control is to provide a tag that lays over everything in the browser.Since the opacity is 0.5 (and 50), it appears gray while allowing the user to continue to see the controls behind it.