Monday, March 26, 2012

Progress template not showing

I got an updatepanle, an updateprogress , a label inside the update panel, and a button outside the updatepanel, what i wanna do is just simple, delay 5 sec before showing the label and at the same time showing the "loading..." before it complete. Problem occured when i put the button outiside of the updatepanel and it did not show the "loading.." and after 5 sec the label will shown , but everything works fine when i put the button in the updatepanel...I did set the button as trigger.

so may i know where is the problem ?

Thanx~

Hi giox,

Posting the code of your page would help us in locating the eventual problem.

Would you be so kind to use the Source Code button of the rich editor to insert code? TNX!

Kind regards,
Wim


i dont believe you need to set the button as a trigger if its in the update panel, also, have you tried setting the update progress "DisplayAfter" property to "0"?


Wim,

<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server" />
<div>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:Label ID="lbl1" runat="server" Style="left: 48px; top: 0px" Text="Label" Width="352px"></asp:Label>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="Button1" />
</Triggers>
</asp:UpdatePanel>
</div>

<asp:UpdateProgress ID="UpdateProgress1" runat="server" AssociatedUpdatePanelID="UpdatePanel1" DisplayAfter="0">
<ProgressTemplate>
loading..
</ProgressTemplate>
</asp:UpdateProgress>
<asp:Button ID="Button1" runat="server" OnClick="Button1_Click" Text="Button" />
</form>

VB code :

Protected Sub Button1_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles Button1.Click
System.Threading.Thread.Sleep(3000)
Me.lbl1.Text = "abc"
End Sub

Thanx~


Lee Brennan:

i dont believe you need to set the button as a trigger if its in the update panel, also, have you tried setting the update progress "DisplayAfter" property to "0"?

The problem occured when the button is outside the update panel..

I tried to set "DisplayAfter" property to "0", but it still not working. thanx anyway.


The documentation is the problem on this one. If you look at the AssocitatedUpdatePanelID attribute, it states "You can set theAssociatedUpdatePanelID property to controls in the same naming container, a parent naming container, or the page."

What exactly that means is certainly not clear, because it does not work if it is used as a sibling of the UpdatePanel. (and you would think that that's what "in the same naming container" means)

If you delete the AssociatedUpdatePanelID completely, your example will work.

Of if you move the UpdateProgress "as is" inside the UpdatePanel, it will also work.


If want to show the UpdateProgress for a control which is outside the UpdatePanel you have to manually hook the initializeRequest and endRequest of PageRequestManager to show the UpdateProgress, like the following:

<script type="text/javascript"> var prm = Sys.WebForms.PageRequestManager.getInstance(); prm.add_initializeRequest(initializeRequest); prm.add_endRequest(endRequest); var _postBackElement; function initializeRequest(sender, e) { if (prm.get_isInAsyncPostBack()) { e.set_cancel(true); } _postBackElement = e.get_postBackElement(); if (_postBackElement.id.indexOf('Button1') > -1) { $get('UpdateProgress1').style.display = 'block'; } } function endRequest(sender, e) { if (_postBackElement.id.indexOf('Button1') > -1) { $get('UpdateProgress1').style.display = 'none'; } }</script>

While I use the technique above as well for most projects, it is not necessary in this example. Simply eliminating the AssociatedUpdatePanelID attribute on the ProgressPanel will allow the example to work. That occurs because Button1 is also defined as a trigger for the panel. What was confusing is why it doesn't work with the attribute set because that is not clear from the documentation for the AssociatedUpdatePanelID attribute.

When reading the documentation for the UpdateProgress, none the scenarios described include the way the example was initially written. Only when the attribute is deleted does the following statement (bold type) apply:

"If you do not set theAssociatedUpdatePanelID property, theUpdateProgress control displays progress for any asynchronous postback that originates from inside anyUpdatePanelor for controls that are triggers for panels."


wrayx1:

While I use the technique above as well for most projects, it is not necessary in this example. Simply eliminating the AssociatedUpdatePanelID attribute on the ProgressPanel will allow the example to work. That occurs because Button1 is also defined as a trigger for the panel. What was confusing is why it doesn't work with the attribute set because that is not clear from the documentation for the AssociatedUpdatePanelID attribute.

It works when eliminating the AssociatedUpdatePanelID ...Thanx..the problem has solved, thanx to those who helping to solve this problem as well.

No comments:

Post a Comment