UpdatePanel 和 Repeater 在回发后呈现页面无响应答案

【问题标题】：UpdatePanel and Repeater render page unresponsive after post-backUpdatePanel 和 Repeater 在回发后呈现页面无响应
【发布时间】：2011-01-11 20:17:43
【问题描述】：

我有一个带有 UpdatePanel 的页面，其中包含一个中继器和一个包含中继器中项目数的文本框。当我更改值时，页面应该回发并使用更新的项目数重新绘制中继器。这原则上可行，但页面在回发后最终冻结并且不接受任何输入 - 仅在 IE 8 中。它在 Firefox 中运行良好。例如，右键单击控件时不会出现上下文菜单，并且无法在文本框中输入文本。

当我取出 UpdatePanel 时，页面工作正常，但当然会在每个回发事件时刷新。这不一定与页面上的Repeater有关。我想我在其他页面上看到了这个。这里有什么诀窍？

<asp:UpdatePanel ID="uPanel" runat="server" UpdateMode="Conditional" 
  EnableViewState="true" ChildrenAsTriggers="true">
  <ContentTemplate>
  <asp:Panel ID="Panel1" runat="server" DefaultButton="btnSubmit">
    <asp:TextBox ID="tbItems" runat="server" AutoPostback="true" 
                      OnTextChanged="textchanged_Items"/>                     
  <asp:Repeater id="rptItems" runat="server" 
           OnItemDataBound="repeaterItem_Databound">
        <...>
      </asp:Repeater>


    protected void textchanged_Items(object sender, EventArgs e) {
        try {
            // this methods rebinds the repeater to a List after changing
            // the number of items in the list
            ReflowItemRepeater();   
            // This is not really necessary, since Databind() appears to
            // cause an update. I tried it anyways.               
            uPanel.Update();
        }
        catch (Exception ex) {
            ShowError(this, "Error displaying the item list.", ex, true);
        }
    }

我最终删除了更新面板。

一个月后，不同的页面，我仍然一次又一次地为此而战。情况是一样的。更新面板、转发器（实际上是 2 个嵌套转发器）和转发器中触发回发事件的控件。服务器正确处理事件并返回控制，但浏览器 (IE8) 从不刷新更新面板。页面没有响应，好像处于某种死锁情况。我可以通过单击触发另一个回发事件的按钮来解锁它（也在更新面板中）。但是当发生这种情况时，面板中的文本框是不可点击或不可编辑的。而且，它只发生在第一次。一旦我“释放”了锁，或者不管它是什么，它就不会在这个页面上再次发生，即使我重复导致它的完全相同的步骤。

发生这种情况时，JIT 调试器不会报告任何内容。

【问题讨论】：

如果您能提供一个测试页以便我们可以看到这一点，这将有所帮助。
正在处理它。将发布一个链接。
所以我的赏金即将到期，但我没有看到值得奖励的答案。我会放手的。我没有解决方案，最终删除了更新面板。至少它是这样工作的。我认为问题是由于各种 MS Ajax 控件不合作，但我没有时间或兴趣深入了解问题。

标签： c# asp.net updatepanel postback repeater

【解决方案1】：

我实际上会在您的更新面板中设置触发器。

我不确定您是否需要在后面的代码中调用 .Update，因为更新面板会在触发发生时更新。

试试这个：

【讨论】：

正确，您不需要显式调用 Update 方法。它实际上仅用于条件更新（即 - 您可能不想根据某些条件更新面板）。
嗯，没关系，但不回答我的问题。
使用触发器不会改变行为。

【解决方案2】：

我的直觉是它与使用 OnTextChanged 事件有关。对于踢球，请尝试在文本框旁边添加一个按钮，并在单击按钮时重排转发器。 IE 还会死机吗？

【讨论】：

【解决方案3】：

所以我将这个页面精简到最低限度，然后我发现了它在做什么——AjaxToolkit:CalendarExtender。如果我把它拿出来，一切正常。不过，我很想知道是否有解决方法。

这是link to my test page。我会坚持几天。

要查看问题，请从下拉列表中选择“2”，然后在第一个数量字段中输入内容并跳出。光标将在下一个字段中闪烁，但不允许输入。这发生在 IE8 中，而不是 Firefox 中。

编辑：实际上，当我返回整页并删除 CalendarExtender 时，它仍然无法正常工作。我确实怀疑这个问题与在 UpdatePanel 中发回的控件有关，但我无法确定它。这似乎是其中 x 个事物的组合不起作用，而 (x-1) 个事物的任何组合都起作用的事情之一。

【讨论】：

【解决方案4】：

关于最初的问题，这里有一个工作示例。我不知道它是否有帮助，但只是为了确保......

<%@ Page Language="C#" %>
<html xmlns="http://www.w3.org/1999/xhtml" >
  <head runat="server"><title>Ajax Test</title></head>
  <body>
    <form id="form1" runat="server">
<asp:ScriptManager runat="server" />

<asp:UpdatePanel runat="server" ChildrenAsTriggers="true">
  <ContentTemplate>
    <asp:Label runat="server" AssociatedControlID="txtTest">
       Enter 'fruit' or 'vegetables':
    </asp:Label>
    <asp:TextBox
      runat="server" ID="txtTest" AutoPostBack="true"
      OnTextChanged="Handler_Test_TextChanged"
    />

    <asp:Repeater runat="server" ID="rptItems">
      <HeaderTemplate><ul></HeaderTemplate>
      <ItemTemplate><li><%# Container.DataItem.ToString() %></li></ItemTemplate>
      <FooterTemplate></ul></FooterTemplate>
    </asp:Repeater>
  </ContentTemplate>
</asp:UpdatePanel>
    </form>
  </body>
</html>

<script runat="server">
  static readonly string[] Fruit = new string[]
    { "Apples", "Oranges", "Bananas", "Pears" };

  static readonly string[] Veg = new string[]
    { "Potatoes", "Carrots", "Tomatoes", "Onion" };

  void Handler_Test_TextChanged(object s, EventArgs e)
  {
    if(txtTest.Text == "fruit")            rptItems.DataSource = Fruit;
    else if(txtTest.Text == "vegetables")  rptItems.DataSource = Veg;
    else                                   return;
    rptItems.DataBind();
  }
</script>

【讨论】：