直到第二次单击，ASP.NET更新面板才会更新

Question

I've looked for answers online but there are so many that I've tried that haven't worked. I have two buttons on the page a "like" and a "dislike" button.

When I click on a button the updatepanel doesn't update but the like data for that user is inserted into the database.

When I click on the button the second time the update panel gets refreshed and works for proceeding clicks. I want the update panel to refresh on the first click

<form id="Matches" runat="server" class="form-horizontal">

        <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>

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

                <div class="row">
              <!-- left column -->
                    <div class="col-lg-12 col-sm-12 col-xs-12">
                        <div class="text-center">
                       ail" />
                            <h1>
                                <asp:Label ID="Label1" runat="server" Text="Label"></asp:Label><asp:Label ID="Label2" runat="server" Text="Label"></asp:Label></h1>
                            <div class="btn-group">
                                <asp:Button ID="Button1" runat="server" CssClass="btn btn-default" Text="Like" OnClick="Button1_Click" /><asp:Button ID="Button2" CssClass="btn btn-default" runat="server" Text="Dislike" OnClick="Button2_Click" />
                            </div>
                        </div>
                    </div>
                </div>

            </ContentTemplate>
            <Triggers>
                <asp:AsyncPostBackTrigger ControlID="Button1" />

                <asp:AsyncPostBackTrigger ControlID="Button2" />
                </Triggers>
        </asp:UpdatePanel> 

C# Code

protected void Button1_Click(object sender, EventArgs e)
        {
            uservote.spAddLike(user.getId(), usermatch.getId());
            VotePanel.Update();

        }
        protected void Button2_Click(object sender, EventArgs e)
        {
            uservote.spAddDislike(user.getId(), usermatch.getId());
            VotePanel.Update();
        }

Answer 1

From comments in addtion to your question, you are calling an update function before you have updated the database. You need to get a better understanding of the page life-cycle .

You are getting a the updated info on page load, this happens before the on click. Try the following

 private void functionToUpdateFields(some arguements)
 {
      /*Call Database and populate form fields*/
 }


 protected void Page_Load(object sender, EventArgs e)
 {
     if (!isPostback)
     {
         functionToUpdateFields(some arguements);
     }
 }

 protected void Button1_Click(object sender, EventArgs e)
 {
        uservote.spAddLike(user.getId(), usermatch.getId());
        functionToUpdateFields(some arguements);
        VotePanel.Update();
 }

 protected void Button2_Click(object sender, EventArgs e)
 {
       uservote.spAddDislike(user.getId(), usermatch.getId());
       functionToUpdateFields(some arguements);
       VotePanel.Update();
 }

When you have all this set up set break poins on each of the event handlers and note the order in which they occur when you debug. This will give you a practical demonstration on the page life cycle.