Button is not working with Update Panel

2020-07-10 05:49发布

问题:

I have placed a timer and a label for displaying countdown time in an update panel. I have placed the next button for displaying the next question outside the update panel.

My problem is that the button click is not working with the update panel. Without using the update panel and the timer it works well. How can I solve the problem?

I have also tried to place whole tools inside the update panel. It didn't help me.

Here is my code:

<asp:UpdatePanel ID="UpdatePanel1" runat="server">
  <ContentTemplate>
    <table class="style1">
        <tr>
            <td class="style2">
                <asp:Timer ID="Timer1" runat="server" Interval="1000" ontick="Timer1_Tick">
                </asp:Timer>
                <asp:Label ID="lblTimer" runat="server"></asp:Label>
        </tr>
        <tr>
            <td style="margin-left: 40px" class="style3">
                <asp:Label ID="lblQuestion" runat="server"></asp:Label>
            </td>
        </tr>
        </table>
         </ContentTemplate>
                 </asp:UpdatePanel>
        <table>
        <tr>
            <td style="margin-left: 40px" class="style2">
                <asp:RadioButtonList ID="rblOptions" runat="server">
                </asp:RadioButtonList>
            </td>
        </tr>
        <tr>
            <td style="margin-left: 40px" class="style2">
                <table class="style1">
                    <tr>
                        <td class="style2">
                            <asp:Button ID="btnNext" runat="server" onclick="btnNext_Click" Text="Next"
                                    Width="75px" />
                        </td>
                        <td>

                            <asp:Button ID="btnFinish" runat="server" onclick="btnFinish_Click"
                                Text="Finish" Width="75px" />
                        </td>
                    </tr>
                    <tr>
                        <td class="style2">
                            &nbsp;</td>
                        <td>
                         <asp:Label ID="lblScore" runat="server">Score : </asp:Label>
                       </td>
                   </tr>
                </table>
            </td>
        </tr>
    </table>
<asp:UpdatePanel>

I added the following code.

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

Still it didn't work. Could you please help me....

The selection of radio button is automatically cleared when using update panel. Any help....?

Thank you....

回答1:

If you are using master page , then add this code in you're page load event

using AjaxControlToolkit;

 

ToolkitScriptManager objScriptManager = (ToolkitScriptManager)this.Master.FindControl("ScriptManager1");
    objScriptManager.AsyncPostBackTimeout = 36000;

..............



回答2:

Your UpdatePanel is malformed. You have one extra asp:UpdatePanel tag in the markup.

Use this instead:

<asp:UpdatePanel ID="UpdatePanel1" runat="server">
    <ContentTemplate>
        <table class="style1">
            <tr>
                <td class="style2">
                    <asp:Timer ID="Timer1" runat="server" Interval="1000" ontick="Timer1_Tick">
                    </asp:Timer>
                    <asp:Label ID="lblTimer" runat="server"></asp:Label>
                </td>
            </tr>
            <tr>
                <td style="margin-left: 40px" class="style3">
                    <asp:Label ID="lblQuestion" runat="server"></asp:Label>
                </td>
            </tr>
        </table>
        <table>
            <tr>
                <td style="margin-left: 40px" class="style2">
                    <asp:RadioButtonList ID="rblOptions" runat="server">
                    </asp:RadioButtonList>
                </td>
            </tr>
            <tr>
                <td style="margin-left: 40px" class="style2">
                    <table class="style1">
                        <tr>
                            <td class="style2">
                                <asp:Button ID="btnNext" runat="server" onclick="btnNext_Click" Text="Next" Width="75px" />
                            </td>
                            <td>
                                <asp:Button ID="btnFinish" runat="server" onclick="btnFinish_Click" Text="Finish" Width="75px" />
                            </td>
                        </tr>
                        <tr>
                            <td class="style2">
                                 &nbsp;</td>
                            <td>
                                <asp:Label ID="lblScore" runat="server">Score : </asp:Label>
                            </td>
                        </tr>
                    </table>
                </td>
            </tr>
        </table>
    </ContentTemplate>
<asp:UpdatePanel>


回答3:

Seems that are unmatched tags. Once correct and go through the layout once again. Instead of using AjaxToolkit library, run with jquery navigation plugins, you can feel more better.



回答4:

Add

<Triggers>    
        <asp:PostBackTrigger ControlID="btnNext" />
        </Triggers>

and add Ajaxtoolkit to your project... then just give below link after <%@ Page .........%>

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>

also add following code in your form tag.

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

It will solve your problem.



回答5:

You must put the Button in update pannel then it will work fine

    <asp:UpdatePanel ID="UpdatePanel1" runat="server">
      <ContentTemplate>
        <table class="style1">
            <tr>
                <td class="style2">
                    <asp:Timer ID="Timer1" runat="server" Interval="1000" ontick="Timer1_Tick">
                    </asp:Timer>
                    <asp:Label ID="lblTimer" runat="server"></asp:Label>
            </tr>
            <tr>
                <td style="margin-left: 40px" class="style3">
                    <asp:Label ID="lblQuestion" runat="server"></asp:Label>
                </td>
            </tr>
            </table>

            <table>
            <tr>
                <td style="margin-left: 40px" class="style2">
                    <asp:RadioButtonList ID="rblOptions" runat="server">
                    </asp:RadioButtonList>
                </td>
            </tr>
            <tr>
                <td style="margin-left: 40px" class="style2">
                    <table class="style1">
                        <tr>
                            <td class="style2">
                                <asp:Button ID="btnNext" runat="server" onclick="btnNext_Click" Text="Next"
                                        Width="75px" />
                            </td>
                            <td>

                                <asp:Button ID="btnFinish" runat="server" onclick="btnFinish_Click"
                                    Text="Finish" Width="75px" />
                            </td>
                        </tr>
                        <tr>
                            <td class="style2">
                                &nbsp;</td>
                            <td>
                             <asp:Label ID="lblScore" runat="server">Score : </asp:Label>
                           </td>
                       </tr>
                    </table>
                </td>
            </tr>
        </table>
</ContentTemplate>
                     </asp:UpdatePanel>


回答6:

You need to register NEXT button to update panel. for registration you need to use <asp:asyncpostbacktrigger xmlns:asp="#unknown"> inside the UpdatePanel

i.e.

<updatepanel>
   <contenttemplate>
       ... body ......
   </contenttemplate>

  <triggers>
     <asp:asyncpostbacktrigger controlid="btnNext" eventname="Click" />
  </triggers>
<updatepanel></updatepanel></updatepanel>


回答7:

If in the page there are validation error (include hidden errors es: modal dialog). Event click not work. Tray to set a different validation group to the button (es: validationGroup="xxx")

<asp:Button ID="btnFinish" validationGroup="none" runat="server" onclick="btnFinish_Click" Text="Finish" />

Hope this help.