Ajax UpdatePanel w/Progress Template and Triggers

S

Scott M.

When setting up an UpdatePanel that utilizes a ProgressTemplate as well as
having non-child triggers (a trigger outside of the UpdatePanel), I get some
strange results (IE 7).

Clicking the trigger button that is outside of the UpdatePanel does trigger
the update, as it should, but the ProgressTemplate does NOT become visible.

Clicking a submit button that is a child of the UpdatePanel, does cause an
async. postback and the ProgressTemplate does appear, but the panel does not
update when the async. operation is completed. This is strange because the
panel has its ChildrenAsTriggers property set to False, so why would
clicking the child button cause the async. postback to occur?

Also, why would clicking the trigger (that is outside of the UpdatePanel)
cause the async. postback, but not cause the ProgressTemplate to show?

Here's the code:

<%@ Page Language="C#" AutoEventWireup="true" %>
<!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 Page_Load(object sender, EventArgs e)
{
// Simulate a long-running server task
System.Threading.Thread.Sleep(3000);

// Deliver results
lblNoAjax.Text = DateTime.Now.ToString();
lblAjax.Text = DateTime.Now.ToString();
}
</script>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Using UpdatePanel Triggers</title>
<link href="../Stylesheets/BasicStyles.css" rel="stylesheet"
type="text/css" />
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:Label ID="lblNoAjax" runat="server"></asp:Label>

<asp:UpdateProgress ID="UpdateProgress1" runat="server"
AssociatedUpdatePanelID="up1"
DisplayAfter="100" DynamicLayout="False">
<ProgressTemplate>...Update in progress...</ProgressTemplate>
</asp:UpdateProgress>

<asp:UpdatePanel ID="up1" UpdateMode="Conditional"
ChildrenAsTriggers="false" runat="server">

<ContentTemplate>
<asp:panel CssClass="up1" runat="server" ID="pan1">
<asp:Label ID="lblAjax" runat="server"></asp:Label>
<br />
<!-- THIS CAUSES THE PROGRESS TEMPLATE TO BECOME VISIBLE UNTIL
THE ASYNC POSTBACK IS COMPLETE, BUT THE UPDATEPANEL IS
NOT
UPDATED -->
<asp:Button ID="btnAjax" runat="server" Text="UpdatePanel Child"
/>
</asp:panel>
</ContentTemplate>

<Triggers>
<asp:AsyncPostBackTrigger ControlID="btnTrigger" EventName="Click"
/>
</Triggers>

</asp:UpdatePanel>
<!-- THIS CAUSES THE ASYNC POSTBACK AND UPDATE TO OCCUR
BUT THE PROGRESS TEMPLATE DOESN'T SHOW -->
<asp:Button ID="btnTrigger" runat="server" Text="Trigger Button" />
</div>
</form>
</body>
</html>
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

Forum statistics

Threads
473,755
Messages
2,569,535
Members
45,007
Latest member
obedient dusk

Latest Threads

Top