Monday, November 23, 2009

Using Ajax To Avoid Timeouts

So I thought since I mentioned AJAX in my last post that I would include how to use it. Not that I am an expert as I just decided to use AJAX for the first time today, and so I'm very new to it, but it was way easy to use.

First thing you do is you have to add a ScriptManager to your page. This is easy to do, it's found in the VS UI tool menu under AJAX Extensions. You don't have to do anything with it other then drop it on your page. You Can edit the AysncPostBackTimeout property if you know your tasks are going to take a while.

Then drop in a AJAX UpdatePanel. This is where the magic happens, anything you put inside this box, say like a command button, when pressed will not cause your entire page to do a post back. You can drop in a Label and update it's text without having to reload the whole page.

Add a AJAX UpdageProgress control and you can put some text in it like "Please wait while your request is processed.." and bam, you have a user message that will be displayed while the AJAX process is running.

One little trick about if you use a Button, I added this code so that the user can't press the button twice:

Button1.OnClientClick = "this.disabled = true;__doPostBack(this.name,'')"


It's really that easy. Here is some code:



<asp:UpdateProgress ID="UpdateProgress1" runat="server"
AssociatedUpdatePanelID="UpdatePanel1">
<ProgressTemplate>
Processing.. Please Wait
</ProgressTemplate>
</asp:UpdateProgress>

<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:Button ID="cmdProcess" runat="server" Text="Process"
onclick="cmdProcess_Click">
</ContentTemplate>
</asp:UpdatePanel>

No comments:

Post a Comment