Thought I would experiment with a timer and update panel.
I have a simple page that I put an updatepanel control, a label, and a timer.
The "TICK" code updates the label with the current time.
The panel never refreshes. If I put the timer object outside the updatepanel, the whole page refreshes every 1 second. So that tells me that AJAX is in fact working. Just never for the update panel only with the time tag inside the updatepanel. I’ve tried it with Triggers tags and without. No change. I put a "STOP" directive in the Timer1_Tick sub/code, and when I inspect the value of the lbl1.text value, it does in fact have the updated value, but it just won’t render it in the updatepanel. This is why it’s a mystery. After several hours of trying anything I could find, I thought I would just ask the experts.
ASPX objects –
<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
<asp:UpdatePanel ID="updPnl1" runat="server" UpdateMode="Conditional">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="Timer1" EventName="Tick" />
</Triggers>
<ContentTemplate>
<asp:Timer ID="Timer1" runat="server" OnTick="Timer1_Tick" Interval="1000"></asp:Timer>
<asp:Label ID="lbl1" runat="server" Text="THIS IS MY LABEL" />
</ContentTemplate>
</asp:UpdatePanel>
Code behind – (I tried with and without the updPnl1.Update statement), and like I said, if I STOP the code, the value of lbl1.text is actually updated, but no displaying it as such)
Protected Sub Timer1_Tick(ByVal sender As Object, ByVal e As System.EventArgs) Handles Timer1.Tick
lbl1.Text = "UpdatePanel1 refreshed at: " & DateTime.Now.ToLongTimeString()
‘Stop
updPnl1.Update()
End Sub
Thanks folks
I tried various examples I’ve found. I was expecting the lbl1.text to update with the current time.
2
Answers
SOLVED! The takeaway from this. When having a response.write on the page, a timer will work for the entire page but a timer in an UPDATEPANEL will not render at all, although the code behind will function for the timer in the update panel. Thanks Albert for the helps.
Really, in 99% of cases, you don’t need nor want a trigger. Why???
Any button, or anything inside of the update panel that cases a post-back works like a regular page lifecycle.
So, if you want the UP to update say due to a button click? Then just make sure the button is inside of the UP and you are 100% fine. (no triggers required).
So, say we want a count down clock of some type.
So, in the update panel, drop in your text boxes (to display the time). Add a button to start, and even one to stop the timer.
And MAKE sure you drop the timer inside of the update panel.
Remember, you can think of a Update Panel as a self contained web page inside of the current page.
Keep in mind while a update panel LOOKS like there is not a post-back?
There is!!! In fact even the page’s "load" event fires and triggers each time!!
The correct term here is what we call a "partial" page post-back. So, the full page life cycle occurs here, but ONLY for the things inside of the Update Panel.
So, lets drop in 3 text boxes and a start and stop button inside of a update panel.
Say this:
Note how we dropped the timer control inside of the panel. A timer control is actually like a button click – it will "post back" the page based on the interval – it really not much different then dropping a button on the page and clicking it.
Note how I have the timer as disabled to start out.
So, now the user can enter values in to the text boxes, and hit the start button.
So, the start stop code (code behind) is this:
Edit: Here is the style I used for the 3 boxes
So, you can drop in this style for the boxes right after the form tag
eg this:
So, the result now looks like this:
Edit3: Example working code based on quesiton
Ok, so the posted markup is this:
And code behind is this:
So, now we see this: