Wednesday, March 21, 2012

How can I tell when an updatepanel has finished updating?

Hi,

Hopefully this is a simpe question! I have a couple of UpdatePanels on my page, and at the top a "Save all" button that calls the "Update" method on each of these updatepanels which gets them to save their contents. Immediatly after doing the updates, I need to render a graph of the data. The problem I have is that the UpdatePanel "updates" are all asynchronous, so my graph doesn't always pick up the newly saved information - because its still being saved while the graph is created.

What I need to do is either get the UpdatePanels to update synchronously, or have some way to fire server-side code once they have finished.

Is this possible?

Thanks!

Matt

Why not update the graph at the end of your "Save all" event handler, if that's what it is you want to do?

Hi,

You cann't process multi-Asyncpostbacks at the sametime, You can process them one by one when you click "Save all".

Following is a demo:

<%@. Page Language="C#" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<script runat="server">
protected void Button1_Click(object sender, EventArgs e)
{
System.Threading.Thread.Sleep(3000);
Label1.Text = "The time is: " + DateTime.Now.ToString();
}
protected void Button2_Click(object sender, EventArgs e)
{
System.Threading.Thread.Sleep(3000);
Label2.Text = "The time is: " + DateTime.Now.ToString();
}
protected void Button3_Click(object sender, EventArgs e)
{
System.Threading.Thread.Sleep(3000);
Label3.Text = "The time is: " + DateTime.Now.ToString();
}
</script>

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title>UpdatePanelTutorialIntro1</title>
<style type="text/css">
#UpdatePanel1 {
width:300px; height:100px;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div style="padding-top: 10px">
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:UpdateProgress ID="UpdateProgress1" runat="server">
<ProgressTemplate>
Processing…
</ProgressTemplate>
</asp:UpdateProgress>
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<fieldset>
<legend>UpdatePanel</legend>
<asp:Label ID="Label1" runat="server" Text="Label"></asp:Label><br />
<asp:Button ID="Button1" runat="server" OnClick="Button1_Click" Text="Button" />
</fieldset>
</ContentTemplate>
</asp:UpdatePanel>
<br />
<br />
<asp:UpdatePanel ID="UpdatePanel2" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<fieldset>
<legend>UpdatePanel</legend>
<asp:Label ID="Label2" runat="server" Text="Label"></asp:Label><br />
<asp:Button ID="Button2" runat="server" OnClick="Button2_Click" Text="Button" />
</fieldset>
</ContentTemplate>
</asp:UpdatePanel>
<br />
<br />
<asp:UpdatePanel ID="UpdatePanel3" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<fieldset>
<legend>UpdatePanel</legend>
<asp:Label ID="Label3" runat="server" Text="Label"></asp:Label><br />
<asp:Button ID="Button3" runat="server" OnClick="Button3_Click" Text="Button" />
</fieldset>
</ContentTemplate>
</asp:UpdatePanel>
<br />
<br />
</div>
</form>

<script type="text/javascript" language="javascript">
Sys.WebForms.PageRequestManager.getInstance().add_beginRequest(BeginRequestHandler);
Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler);
var thebutton;
function BeginRequestHandler(sender, args)
{
$get('UpdateProgress1').style.display = 'block';
thebutton = args.get_postBackElement();
thebutton.disabled = true;
}
function EndRequestHandler(sender, args)
{
$get('UpdateProgress1').style.display = 'none';
thebutton.disabled = false;
var str = thebutton.id
if(document.getElementById("Button" + (parseInt(str.substring(6, str.length)) + 1)))
document.getElementById("Button" + (parseInt(str.substring(6, str.length)) + 1)).click();
}
</script>

</body>
</html>

Best Regards,


Thanks very much. Your example shows me that I can call the buttons "click" manually using the EndRequestHandler, to then go and call the next one. I think I can use that information to achieve what I was after :)


I have a similar situation. You'll have to register two events EndRequest, InitializeRequest and queuing system.

Please refer tohttp://forums.asp.net/p/1167326/1944939.aspx#1944939 for the code example.

Let me know if this helped.

No comments:

Post a Comment