Question

I’m a PHP guy learning some .NET. I am tinkering around with the UpdatePanel control for a little dashboard.

In .aspx file, I’m using OnClick to trigger the code behind file to update the label by +1

<asp:ScriptManager ID="ScriptManager1" runat="server" />
<div id="Container">
<asp:UpdatePanel runat="server" ID="UpdatePanel1" 
    OnLoad="UpdatePanel1_Load">
  <ContentTemplate>
      <asp:Label ID="CounterOne" runat="server" Text="Label"></asp:Label>
  </ContentTemplate>

</asp:UpdatePanel>

<asp:Button ID="Button1" runat="server" Text="Button" OnClick="UpdatePanel1_Increment"/>

However, when I run it on localhost. It increments the first time I push the button, but each subsequent click does nothing.

Here is the CodeBehind:

 public void UpdatePanel1_Increment(object sender, EventArgs e)
        {
            counter = counter + 1;
            CounterOne.Text = counter.ToString();

        }

Do I need to reset something on the control?

Thanks!

Note: I know there are more bandwidth friendly ways to do this, but I’m just testing out some ideas…

Answer 1

Remove the OnLoad even from the UpdatePanel and add the following code before you close the UpdatePanel.

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

By adding the Trigger, you are telling the ScriptManager to update this UpdatePanel whenever Button1 is clicked.

This link is a great introduction from http://www.asp.net on how to use UpdatePanels and Triggers: http://www.asp.net/ajax/tutorials/understanding-asp-net-ajax-updatepanel-triggers

EDIT: Your problem is likely related to the counter variable in UpdatePanel1_Increment. Every time you postback, the counter variable is being reset to 0. So, the UpdatePanel is being updated correctly only it is being updated with 0 + 1 = 1 every time. UpdatePanels create the illusion of synchronous updates but the update is actually occurring asynchronously and the variables are not maintained by the server. You need some way to tell the code behind that the new value for counter has been updated since the counter value is “forgotten” immediately after you update the UpdatePanel.

There are a lot of ways to pass the counter value to the server. A quick and easy way is as follows:

public void UpdatePanel1_Increment(object sender, EventArgs e)
        {
            counter = int.Parse(CounterOne.Text); //This is how we'll tell the server what the counter value currently is.
            counter = counter + 1;
            CounterOne.Text = counter.ToString();

        }

Finally, make sure that CounterOne.Text = “0” when the page loads and everything will work as you expect it to.