添加 UpdateProgress 后 UpdatePanel 中断答案

【问题标题】：UpdatePanel breaks after adding UpdateProgress添加 UpdateProgress 后 UpdatePanel 中断
【发布时间】：2016-01-14 06:45:08
【问题描述】：

我有一些代码包含一个面板，我在其中放置了来自代码隐藏的 ASP 图表。在面板下方，我放置了一个带有回发事件的按钮，该事件更改了该图表的某些参数。

下面是简化版的代码：

...
<asp:UpdatePanel ID="udp" runat="server">
  <ContentTemplate>
    <asp:Panel ID="pnl_chart" runat="server" />
    <asp:Button ID="btn_chart" UseSubmitBehavior="false" runat="server" />
  </ContentTemplate>
</asp:UpdatePanel>
...

以及背后的代码：

Private Property AltChart As Boolean
  Get
    If Me.ViewState("simulador_avanzado") Is Nothing Then
      Return False
    End If
    Return ToBool(Me.ViewState("simulador_avanzado"))
  End Get
  Set(value As Boolean)
    Me.ViewState("simulador_avanzado") = value
  End Set
End Property    

Private Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles MyBase.Load
  ...
  If IsPostBack AndAlso ToStr(Me.Request("__EVENTTARGET")).Contains("btn_chart") Then
    AltChart = Not AltChart
  End If

  Dim cht as New Chart
  'Build the chart...'
  pnl_chart.Controls.Add(cht)
  ...
End Sub

这就像一个魅力，但是当我添加一个 UpdateProgress 时，PostBack 停止工作。每当我单击该按钮时，UpdateProgress 会显示 2-3 秒（正是执行 PostBack 所需的时间），但随后它会隐藏并且不会刷新 UpdatePanel 内容。

这是新代码：

...
<asp:UpdatePanel ID="udp" runat="server">
  <ContentTemplate>
    <asp:Panel ID="pnl_chart" runat="server" />
    <asp:Button ID="btn_chart" UseSubmitBehavior="false" runat="server" />
  </ContentTemplate>
</asp:UpdatePanel>

<asp:UpdateProgress ID="udpro" AssociatedUpdatePanelID="udp" DynamicLayout="false" runat="server">
  <ProgressTemplate>
    <div class="udp_progress">
    </div>
  </ProgressTemplate>
</asp:UpdateProgress>
...

我调试了部分回发，后面的代码按预期工作，它更新了 AltChart 变量和图表本身。

简单地说：UpdatePanel 部分回发工作完美，但是当我添加一个绑定到它的 UpdateProgress 时，它的内容不会在部分回发时更新。

更新：我收到下一个客户端错误：

SCRIPT5022：Sys.InvalidOperationException：找不到 ID 为“ctl00_Body_ctl02_udp_button”的 UpdatePanel。如果它是动态更新的，那么它必须在另一个 UpdatePanel 中。

显然UpdateProgress生成的js被缓存了。 ID 为 udp_button 的 UpdatePanel 来自先前版本的代码，它不再存在（我在 UpdatePanel 之外有按钮，我用它自己的 UpdatePanel 包装它以使 UpdateProgress 知道异步回发，在这个example之后，现在我只是把它放在图表的UpdatePanel中）。

清除浏览器缓存似乎不起作用（以及使用不同的浏览器）。

更新 2：好的，我错了。

udp_button 是页面上的另一个 UpdatePanel，它在用户控件中，我没有注意到它。我将尝试在两个 UpdatePanel 上放置一些有条件的 UpdateMode，看看是否可以阻止 UpdateProgress 更新错误的 UpdatePanel。

【问题讨论】：

您是否收到任何客户端 JavaScript 错误？
是的！我更新了问题
我解决了！感谢您的提示！

标签： asp.net ajax updatepanel updateprogress

【解决方案1】：

我做了我在 Update 2 中提到的事情，并且成功了！

显然，UpdateProgress 控件生成的 javascript 代码尝试更新受异步回发影响的页面上的所有 UpdatePanel，但找不到 Web 用户控件内的 UpdatePanel（它用于查找的 ID面板与面板 ClientID 不匹配）。

解决方案：为 Web 用户控件内部的 UpdatePanel 建立属性UpdateMode="Conditional"，并使其仅在需要时更新。这样，在按钮生成的异步回发期间不会更新 Web 用户控件，并且 UpdateProgress 的 javascript 不会尝试找到它。

【讨论】：