UpdatePanel does not prevent button from reload page

Question

I just wanted to short this question's example by making a short prototype to test the UpdatePanel functionality to disable ASP.NET page reload on linkbutton click. I have seen this approach in questions like this. In order to test this I have created a new ASP.NET WebForms application, added an ASP LinkButton, surronded by an UpdatePanel. I have added breakpoints on both OnClick and PageLoad events, in Visual Studio .cs file. This is the code in ASP file:

<asp:ScriptManager ID="ScriptManager1" runat="server" />
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:LinkButton ID="LinkButton1" OnClick="OnLinkClick" runat="server">Click me, no reload, I promise!</asp:LinkButton>
</ContentTemplate>
</asp:UpdatePanel>

And the .cs file code:

    protected void Page_Load(object sender, EventArgs e)
    {
        //page reload things...
    }

    protected void OnLinkClick(object sender, EventArgs e)
    {
        //on click thigs...
    }

What happens is that everytime I click on the LinkButton, the first breakpoint is triggered is the PageLoad one and then the OnClick one. I thought that using UpdatePanel will avoid this behavior.

What Am I doing wrong, or why shouldn't I expect the PageLoad not to be invoked? Is this a good way to test if the LinkButton click reloads the page?

use `asp:AsyncPostBackTrigger` on your button inside `UpdatePanel` — techspider, Jun 23 '16 at 16:28
Please refer [this](https://msdn.microsoft.com/en-us/library/bb386454.aspx?f=255&MSPPError=-2147217396) article — techspider, Jun 23 '16 at 16:29

ConnorsFan · Accepted Answer · 2016-06-23T17:28:58.193

As mentioned by Clint B, the processing of postback events in code-behind is normal. You can test your UpdatePanel with two Labels, one inside and one outside of the UpdatePanel:

<asp:Label ID="lbl1" runat="server" Text="Label 1" BackColor="Aqua" />
<asp:UpdatePanel ID="up1" runat="server">
    <ContentTemplate>
        <asp:Label ID="lbl2" runat="server" Text="Label 2" BackColor="Yellow" />
        <asp:LinkButton ID="LinkButton1" runat="server" Text="Update, no reload!" OnClick="OnLinkClick" />
    </ContentTemplate>
</asp:UpdatePanel>

The event handler of the LinkButton updates both Labels:

protected void OnLinkClick(object sender, EventArgs e)
{
    lbl1.Text = DateTime.Now.ToString();
    lbl2.Text = DateTime.Now.ToString();
}

If the partial refresh works, the changes made to lbl2 are visible in the page, while lbl1 still displays its original text.

Cool, this is the answer I was looking for, thank you very much! It shows how can be tested partial reload, and it works, even though the PageLoad is triggered. — meJustAndrew, Jun 23 '16 at 17:41

score 1 · Answer 2 · answered Jun 23 '16 at 16:42

1

Even though you are doing a partial post back, the framework still executes the page life cycle which includes Page_Load. But you will only be able to effect changes in the browser to the controls that are inside the update panel.

As techspider mentioned, you need to assign a post back trigger. So your example should look like this.

<asp:ScriptManager ID="ScriptManager1" runat="server" />
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
   <asp:LinkButton ID="LinkButton1" OnClick="OnLinkClick" runat="server">Click me, no reload, I promise!</asp:LinkButton>
</ContentTemplate>
<Triggers>
  <asp:AsyncPostBackTrigger ControlID="LinkButton1" EventName="Click" /> 
</Triggers>
</asp:UpdatePanel>

answered Jun 23 '16 at 16:42

Clint B

4,610
2
18
22

And in this case the page will not be reloaded if one clicks on LinkButton? – meJustAndrew Jun 23 '16 at 16:44
Correct. Only the things inside the update panel will be reloaded in the browser. – Clint B Jun 23 '16 at 16:52
1

Since `ChildrenAsTriggers` is true by default, and since the LinkButton is inside the UpdatePanel, it is not necessary to add it explicitly to the triggers list. – ConnorsFan Jun 23 '16 at 16:56

score 1 · Answer 3 · answered May 17 '18 at 09:05

1

I found that when i use LinkButton inside an updatepanel, page is doing postback (page is fully refreshed in the browser) UNLESS i indicate an ID and ClientIDMode="AutoID" on the LinkButton control.

answered May 17 '18 at 09:05

maozx

319
4
5

Found my answer. – Ahmer Ali Ahsan Nov 05 '18 at 20:55

UpdatePanel does not prevent button from reload page

3 Answers3

Linked