如何在异步回发期间更新页面？

Question

我难住了。 我试图在我的网站执行查询时显示进度条。 查询需要 4-6 分钟。 我的进度条从数据库中获取它的值，Oracle 有一个内置查询来为进度条提供值。 我正在使用EssentialObjects 的 ProgressBar 。 基本上我只是将“值”设置为介于 1 和 100 之间的 integer。

这是我的代码的简化版本：

页：

 <asp:UpdatePanel ID="upQuery" runat="server">
    <ContentTemplate>
        <asp:Button ID="btnExecute" runat="server" OnClick="btnExecute_Click" />
    </ContentTemplate>
</asp:UpdatePanel>
<asp:UpdatePanel ID="upProgress" runat="server">
    <ContentTemplate>
        <asp:Timer ID="tmr" runat="server" Enabled="false" 
                   OnTick="tmr_Tick" Interval="3000"></asp:Timer>
        <eo:ProgressBar ID="pbr" runat="server" ></eo:ProgressBar>
    </ContentTemplate>
</asp:UpdatePanel>

代码：

protected void btnExecute_Click(object sender, EventArgs e) {
        tmr.Enabled = true;
        ExecuteLongQuery();
}

protected void tmr_Tick(object sender, EventArgs e) {
        pbr.Value = GetProgress();
}

基本上，当我单击 btnExecute 时，在回发完成之前计时器不会启动，从而使进度条永远不会显示。 我尝试了回调，不确定我是否做对了，但页面在回发期间不会显示结果。 当页面处于异步回发状态时，如何让计时器（或任何东西）响应？

Answer 1

我找到了这个，它对我有用。 您可以根据需要进行更改。 它适用于每个页面回发，如果您想限制它，请根据您的要求更改代码。

<html xmlns="http://www.w3.org/1999/xhtml">
    <head id="Head1" runat="server">
        <title></title>
        <style type="text/css">
             .modalPopup
             {
                 background-color: #696969;
                 filter: alpha(opacity=40);
                 opacity: 0.7;
                 xindex: -1;
             }
         </style>
     </head>
     <body>
         <form id="form2" runat="server">
              <asp:ScriptManager ID="ScriptManager2" runat="server" />
              <script type="text/javascript">
                  var prm = Sys.WebForms.PageRequestManager.getInstance();
                  //Raised before processing of an asynchronous postback starts and the postback request is sent to the server.
                  prm.add_beginRequest(BeginRequestHandler);
                  // Raised after an asynchronous postback is finished and control has been returned to the browser.
                  prm.add_endRequest(EndRequestHandler);
                  function BeginRequestHandler(sender, args) 
                  {
                      //Shows the modal popup - the update progress
                      var popup = $find('<%= modalPopup.ClientID %>');
                      if (popup != null) 
                      {
                          popup.show();
                      }
                  }

                  function EndRequestHandler(sender, args) 
                  {
                      //Hide the modal popup - the update progress
                      var popup = $find('<%= modalPopup.ClientID %>');
                      if (popup != null)  
                      {
                          popup.hide();
                      }
                  }
              </script>
              <div>
                  <asp:UpdateProgress ID="UpdateProgress1" runat="server">
                      <ProgressTemplate>
                          <asp:Image ID="Image1" ImageUrl="waiting.gif" AlternateText="Processing" runat="server" />
                      </ProgressTemplate>
                  </asp:UpdateProgress>
                  <ajaxtoolkit:modalpopupextender id="modalPopup" runat="server" targetcontrolid="UpdateProgress" popupcontrolid="UpdateProgress" backgroundcssclass="modalPopup" />
                  <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
                      <ContentTemplate>
                          <asp:Button ID="Button1" runat="server" Text="Submit" OnClick="btnSubmit_Click" />
                      </ContentTemplate>
                  </asp:UpdatePanel>
            </div>
        </form>
    </body>
</html>

Answer 2

在回发完成之前，您启用计时器的事实不会传递给客户端。 这就是它的工作原理。 在服务器上执行代码不会立即对客户端产生影响。 如果您在将响应发送到客户端之前等待ExecuteLongQuery()完成，那么您将永远不会看到计时器。

您最好的选择可能是在服务器上的单独线程中运行ExecuteLongQuery() ，允许回发完成并启动计时器。

我建议阅读 ASP.Net 页面生命周期——这看起来是个不错的起点。

如何在异步回发期间更新页面？

问题描述

2 个解决方案

解决方案1
5 2011-12-16 07:23:27

解决方案2
4 已采纳 2011-07-21 12:50:34

如何在异步回发期间更新页面？

问题描述

2 个解决方案

解决方案1 5 2011-12-16 07:23:27

解决方案2 4 已采纳 2011-07-21 12:50:34

解决方案1
5 2011-12-16 07:23:27

解决方案2
4 已采纳 2011-07-21 12:50:34