ASP.NET UpdatePanel 不工作,它会刷新整个页面

ASP.NET UpdatePanel not working, it refreshes the whole page

我刚开始使用 UpdatePanel,我有 2 个 DropDownList: DropDownList_1DropDownList_2 其中 DropDownList_2 内容将取决于 DropDownList_1 所选值,这是我的代码:

ASPX:

<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
    <ContentTemplate>
        <asp:DropDownList ID="DropDownList_1" runat="server" AutoPostBack="true" OnSelectedIndexChanged="DropDownList_1_SelectedIndexChanged" DataSourceID="businessgroup" DataTextField="BusinessGroupName" DataValueField="Id"></asp:DropDownList>
    </ContentTemplate>
    <Triggers>
        <asp:AsyncPostBackTrigger ControlID="DropDownList_1" EventName="SelectedIndexChanged" />
    </Triggers>
</asp:UpdatePanel>

<asp:DropDownList ID="DropDownList_2" runat="server" DataSourceID="jobposition" DataTextField="JobPositionName" DataValueField="Id"></asp:DropDownList>

CS:

protected void DropDownList_1_SelectedIndexChanged(object sender, EventArgs e)
{
    SqlDataSource1.SelectCommand = "SELECT DISTINCT * FROM [JobPosition] WHERE BusinessGroupID ="+DropDownList_1.SelectedValue;
    DropDownList_2.DataBind();
}

它的工作如上所述,但我不希望在我的输出中刷新整个页面,我也尝试删除 DropDownList_1 中的 AutoPostBack="true" 但它停止工作,我是什么在这里做错了吗?谢谢!

编辑:

我也尝试将 DropDownList_2 移动到 UpdatePanel 的 ContentTemplate 中,但整个页面仍然刷新。

这是你应该做的:

  • 如果要刷新第二个下拉菜单,第二个下拉菜单应该在更新面板内

  • 只为第二个下拉设置AutoPostBack="true"

  • 为更新面板设置UpdateMode="Conditional"(否则每次都会刷新)
  • 设置面板的AsyncPostBackTrigger指向第一个下拉SelectedIndexChanged事件
  • 为更新面板设置ChildrenAsTriggers="true"

:

<asp:ScriptManager ID="ScriptManager1" runat="server" EnablePartialRendering="true"></asp:ScriptManager>     
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional" ChildrenAsTriggers="true">
                <ContentTemplate>
                    <asp:DropDownList ID="DropDownList1" runat="server" OnSelectedIndexChanged="DropDownList_1_SelectedIndexChanged" DataSourceID="businessgroup" DataTextField="BusinessGroupName" DataValueField="Id"></asp:DropDownList>
                    <asp:DropDownList ID="DropDownList_2" runat="server" AutoPostBack="true" DataSourceID="jobposition" DataTextField="JobPositionName" DataValueField="Id"></asp:DropDownList>
                </ContentTemplate>
                <Triggers>
                    <asp:AsyncPostBackTrigger ControlID="DropDownList_1" EventName="SelectedIndexChanged" />
                </Triggers>
            </asp:UpdatePanel>

控件应位于同一个更新面板中,这样更简单。

我找到了修复方法,感谢 Cristina 提醒我检查控制台错误。我所做的仅供遇到相同问题的任何人参考:

  1. 我缺少 Ajax 库,因此我在此文件夹脚本>WebForms>MSAjax.[=21= 中导入了 MicrosoftAjax.js 和 MicrosoftAjaxWebService ]
  2. 在我导入必要的 Ajax 库后,我遇到了这个控制台错误:

MicrosoftAjaxWebForms.js:6 Uncaught Sys.WebForms.PageRequestManagerServerErrorException: Sys.WebForms.PageRequestManagerServerErrorException: Invalid postback or callback argument. Event validation is enabled using in configuration or <%@ Page EnableEventValidation="true" %> in a page. For security purposes, this feature verifies that arguments to postback or callback events originate from the server control that originally rendered them. If the data is valid and expected, use the ClientScriptManager.RegisterForEventValidation method in order to register the postback or callback data for validation.

我所做的是在该 Ajax 页面内的 <%Page %> 指令中添加 EnableEventValidation="false"

之后我不再重新加载整个页面,现在一切都按照我想要的方式进行。

当您使用更新面板时,您必须在刷新页面时注册您的事件,为此您必须使用 Microsoft 的 PageRequestManager 重新订阅每次更新。

您必须在 document.ready(function(){}) 中初始化您的活动 javascript.

例如:var test=Sys.WebForms.PageRequestManager.getInstance();

如果您的面板在您按照指南进行设置后仍然回发,请检查您是否没有为执行回调的特定控件或通过使 ClientIDMode 默认为静态设置 ClientIDMode="Static"继承自 web.config、页面或父容器。

在您的解决方案中搜索 ClientIDMode="Static" 并针对继承的控件(包括触发回发的控件)更改此设置,或者为触发回发的每个控件显式设置 ClientIDMode="Predictable"ClientIDMode="AutoID"回发。