更新面板内的按钮在内容页面中不起作用答案

【问题标题】：Button inside Update Panel not working from Content Page更新面板内的按钮在内容页面中不起作用
【发布时间】：2018-08-04 22:10:24
【问题描述】：

我在内容页面内遇到更新面板问题，如果我将按钮事件等控件放在内容页面上的 UpdatePanel 内，我的控件不会触发。

以下是我的主页面和内容页面的结构。

在母版页上，我正在使用更新面板进行电子邮件注册，在母版页上运行良好。但是当我尝试在内容/子页面上添加更新面板时，按钮事件不会因为某些原因触发。我查看了几个示例，但似乎没有任何效果。

以下是两个页面的结构，不知道我做错了什么

母版页

    <%@ Master Language="C#" AutoEventWireup="true" CodeFile="MainMP.master.cs" Inherits="MainMP" %>
    <%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>
    <!DOCTYPE html>

    <html>
    <head runat="server">
        <title></title>
        <!--  -->
          <asp:ContentPlaceHolder id="head" runat="server">
        </asp:ContentPlaceHolder>
         <!--  -->
    </head>
    <body>
        <form id="form2" runat="server">
        <asp:ScriptManager runat="server" EnablePageMethods="true">
            <Scripts>
                <asp:ScriptReference Name="jquery" />
                <asp:ScriptReference Name="WebForms.js" Assembly="System.Web" />
                <asp:ScriptReference Name="WebUIValidation.js" Assembly="System.Web" />
            </Scripts>
        </asp:ScriptManager>



 <!-- Page Content-->
      <asp:ContentPlaceHolder id="ContentPlaceHolder1" runat="server">

 </asp:ContentPlaceHolder>
                    <!-- Page Content -->

    </form>

</body>
</html>

内容页

<%@ Page Title="" Language="C#" MasterPageFile="~/MainMP.master" AutoEventWireup="true" CodeFile="Blog.aspx.cs" Inherits="Blog" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server">

<!-- Some Page content ...... -->

          <asp:UpdatePanel ID="updxxxx" runat="server" UpdateMode="Conditional">
               <ContentTemplate>

                <asp:Panel ID="Panel1" runat="server" >
                     <asp:Button ID="Button1" runat="server" Text="Button" OnClick="Button1_Click" />
                </asp:Panel>
            </ContentTemplate>
        </asp:UpdatePanel>


</asp:Content>

【问题讨论】：

标签： c# asp.net webforms updatepanel

【解决方案1】：

如果您的按钮在更新面板之外，那么您需要将该按钮设置为更新面板中的触发器，以便它启动回发。

【讨论】：

我也尝试过触发，但我的按钮在更新面板中，我尝试了这个简单的例子，它甚至不起作用aspdotnet-suresh.com/2012/05/…

【解决方案2】：

也许你可以如下测试，然后添加AjaxControlToolkit。

大师：

<%@ Master Language="C#" AutoEventWireup="true" CodeBehind="SiteTest.master.cs" Inherits="ZeroBig.m_test.SiteTest" %>

  <!DOCTYPE html>

  <html>

  <head runat="server">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
    <asp:ContentPlaceHolder ID="head" runat="server">
    </asp:ContentPlaceHolder>
  </head>

  <body>
    <form id="form1" runat="server">
      <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
      <div>
        <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
        </asp:ContentPlaceHolder>
      </div>
    </form>
  </body>

  </html>

页面：

<%@ Page Title="" Language="C#" MasterPageFile="~/m_test/SiteTest.Master" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="ZeroBig.m_test.WebForm1" %>
  <asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
  </asp:Content>
  <asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
    <asp:UpdatePanel ID="updxxxx" runat="server" UpdateMode="Conditional">
      <ContentTemplate>
        <asp:Panel ID="Panel1" runat="server">
          <asp:Button ID="Button1" runat="server" Text="Button" OnClick="Button1_Click" />
          <asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
        </asp:Panel>
      </ContentTemplate>
    </asp:UpdatePanel>
  </asp:Content>

页面.cs

public partial class WebForm1 : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {

    }

    protected void Button1_Click(object sender, EventArgs e)
    {
        Label1.Text = "hello";
    }
}

如果单击按钮，标签文本变为“hello”，面板会更新。

【讨论】：

我对问题进行了排序，问题是由于将文件放置在适当的位置后与包含的 js 文件发生冲突，并且它有效。我将重要的 js 文件保存在 MasterPage 的脚本管理器下方，并将 custom.js 文件保存在页面末尾。还将 jQuery Nuget 升级到我正在使用的版本。