Wednesday, March 28, 2012

Multiple Update Panels not exactly asynchronous

Hi,

I'm having trouble getting a page with 2 update panels to update themselves asynchronously. It appears, the update inside of one update panel is canceled as soon as the other update panel begins an update.

I want to be able to click a button inside of an update panel. Then, while that panel is updating, click on another button inside of another update panel without canceling the first update.

Not sure if this makes sense or if it's possible, but below is some code demonstrating the issue. When you try to click both buttons, the update of the first button is cancelled.

1<%@dotnet.itags.org. Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>23<%@dotnet.itags.org. Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>4<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">5<html xmlns="http://www.w3.org/1999/xhtml">6<head runat="server">7 <title>Untitled Page</title>8</head>9<body>10 <form id="form1" runat="server">11 <asp:ScriptManager ID="ScriptManager1" runat="server" />12 <div>13 <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">14 <ContentTemplate>15 <asp:UpdateProgress ID="UpdateProgress2" runat="server" AssociatedUpdatePanelID="UpdatePanel1">16 <ProgressTemplate>17 Updating UpdatePanel1...18 </ProgressTemplate>19 </asp:UpdateProgress>20 <asp:Label ID="lblUpdate1" runat="server"></asp:Label>21 <asp:Button ID="btnUpdate1" runat="server" OnClick="Button1_Click" Text="Update 1" />22 </ContentTemplate>23 <Triggers>24 <asp:AsyncPostBackTrigger ControlID="btnUpdate1" EventName="Click" />25 </Triggers>26 </asp:UpdatePanel>27 </div>28 <asp:UpdatePanel ID="UpdatePanel2" runat="server" UpdateMode="Conditional">29 <ContentTemplate>30 <asp:UpdateProgress ID="UpdateProgress1" runat="server" AssociatedUpdatePanelID="UpdatePanel2">31 <ProgressTemplate>32 Updating UpdatePanel2...33 </ProgressTemplate>34 </asp:UpdateProgress>35 <asp:Label ID="lblUpdate2" runat="server"></asp:Label>36 <asp:Button ID="btnUpdate2" runat="server" OnClick="btnUpdate2_Click" Text="Update 2" />37 </ContentTemplate>38 <Triggers>39 <asp:AsyncPostBackTrigger ControlID="btnUpdate2" EventName="Click" />40 </Triggers>41 </asp:UpdatePanel>42 </form>43</body>44</html>45

1using System;2using System.Data;3using System.Configuration;4using System.Web;5using System.Web.Security;6using System.Web.UI;7using System.Web.UI.WebControls;8using System.Web.UI.WebControls.WebParts;9using System.Web.UI.HtmlControls;10using System.Threading;1112public partialclass _Default : System.Web.UI.Page13{14protected void Page_Load(object sender, EventArgs e)15 {1617 }1819protected void Button1_Click(object sender, EventArgs e)20 {21 Thread.Sleep(5000);22 lblUpdate1.Text = DateTime.Now.ToString();23 }24protected void btnUpdate2_Click(object sender, EventArgs e)25 {26 Thread.Sleep(5000);27 lblUpdate2.Text = DateTime.Now.ToString();28 }29}

Take a look at this post:http://forums.asp.net/t/1117212.aspx and this one:http://forums.asp.net/t/1108522.aspx

Basically, you can only have 1 asynchronous request at a time with UpdatePanels.

-Damien


See the link it will solve your problem

http://forums.asp.net/t/1108522.aspx


Awesome. That works great for buttons.

Any idea how to do the same thing for other events? Like a GridView Sorting or SelectedIndexChanged event?


Checkout this posthttp://geekswithblogs.net/rashid/archive/2007/08/08/Asp.net-Ajax-UpdatePanel-Simultaneous-Update--A-Remedy.aspx


KaziManzurRashid:

Checkout this posthttp://geekswithblogs.net/rashid/archive/2007/08/08/Asp.net-Ajax-UpdatePanel-Simultaneous-Update--A-Remedy.aspx

Thanks Kazi. That works, but for some reason it does not work if I use a MasterPage. I've tried putting the scriptmanager in the masterpage and in the webform using that master page and it doesn't work either way. Any ideas why?

EDIT: BTW, It appears the _doPostBack() method of the prm instance is not working for elements inside of a masterpage. Not sure what I'm doing wrong.


I was able to fix my MasterPage problem by making the changes suggested by the 2 comments in the blog.

I also made the following change to the endRequest() function in order to support GridView postbacks:

1function endRequest(sender, args)2 {3 //Check if we have a pending call4 if (_callQueue.length > 0)5 {6 //Get the first item from the call queue and setting it7 //as current executing item8 _executingElement = Array.dequeue(_callQueue);9 var _element = _executingElement[0];10 var _eventArg = _executingElement[1];1112 //Now Post the from which will also fire the initializeRequest13 if(_element.name != null)14 _prm._doPostBack(_element.name, _eventArg);15 else16 _prm._doPostBack(_element.id.replace(/_/g,"$"), _eventArg);17 }18 }

So basically if the executingElement does not have a name set, I create it by replacing the '_' characters in the id with '$' characters (not sure if this is ok, but it's working).

My final problem: The UpdateProgress control is not displaying for the queued requests. Any idea how to make this work??

Thanks,

Fred

No comments:

Post a Comment