ASP.NET 如何 post 在 postback 期间更新（我知道 postback 是如何工作的，但仍然......）

Question

开始之前 - 我知道回发是如何工作的，我知道页面只有在完全呈现后才会更新，我只是想确定一下，没有我的案例的解决方案是对页面进行小幅更新。

问题定义。我有 ASP.NET 项目和 WCF 服务。 WCF 服务包含一些函数，这些函数 return 一些字符串作为结果（例如，是有错误还是进展顺利）。在 ASP.NET 网站上，我有一个按钮，可以触发一系列操作。这些操作是来自 WCF 服务的函数调用。使用通常的回发（称为我按下按钮的回发），只有在收到所有功能的结果时页面才会重新加载，因为它应该是（这需要相当多的时间）。所有结果都添加到文本框中。

问题。有没有办法真正将结果异步添加到文本框？我的意思是，真的，使用 AJAX/something else，我不在乎。我无法相信这个问题在 ASP.NET 中没有得到解决。我只需要用户在触发整个序列之前查看进度 - 触发函数的结果。

我花了几个小时，除了 UpdatePanel 没有找到任何线索，但我无法用它来解决这个问题。你有什么想法吗？

protected void Button1_Click(object sender, EventArgs e)
{
  textBox1.text += wcf.function1();
  textBox1.text += wcf.function2();
  textBox1.text += wcf.function3();
  //only now the page updates.
}

Answer 1

使用 ajax 和通用处理程序的演示。此示例是在 MonoDevelop 中制作的，但您可以在不更改代码的情况下传递给 Visual Studio。文件夹和文件：

/*
DemoGenericHandler
     |
     |---Default.aspx
     |---Default.aspx.cs
     |
     |---GenericHandlers
     |         |
     |         |---MyHandler.ashx
     |         |---MyHandler.ashx.cs
     |
     |---web.config

*/

这是 Default.aspx

的代码

<%@ Page Language="C#" Inherits="DemoGenericHandler.Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head runat="server">
 <title>Default</title>
 <script type="text/javascript" src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
 
 <script type="text/javascript">
 
 $(document).ready(function(){
  var $button1 = $("#<%= Button1.ClientID %>");
  var $txt1 = $("#<%= textBox1.ClientID %>");
  var $txt2 = $("#<%= textBox2.ClientID %>");
  var $txt3 = $("#<%= textBox3.ClientID %>");
  
  var $progressBar = $("#progressBar");
  
  $button1.click(function(e){
  
   //avoid postback
   e.preventDefault();
   
   //show progress bar
   $progressBar.fadeIn('fast');
   
   //ajax-post
   $.post("<%= ResolveClientUrl("~/") %>GenericHandlers/MyHandler.ashx", 
     {data:"requestFromDefaultPage"},
     function(jsonInstance){
      if(jsonInstance)
      {
       $txt1.val(jsonInstance.Value1);
       $txt2.val(jsonInstance.Value2);
       $txt3.val(jsonInstance.Value3);
      }
      
      //hide progressbar
      $progressBar.fadeOut('fast');
     
     });//ajax-post  
  });//click
  
 });
 </script>
</head>
<body>
 <form id="form1" runat="server">
  <asp:Button id="Button1" runat="server" Text="Call Ajax!" OnClick="Button1_Click" /> 
  <img src="http://casa-vivebien.com/contents/media/progressbar.gif" id="progressBar" title="" style="display:none;" />
  <br />
  
  <asp:TextBox ID="textBox1" runat="server"></asp:TextBox>
  <asp:TextBox ID="textBox2" runat="server"></asp:TextBox>
  <asp:TextBox ID="textBox3" runat="server"></asp:TextBox>
  
 </form>
</body>
</html>

这是隐藏代码：

using System;
using System.Web;
using System.Web.UI;

namespace DemoGenericHandler
{
    public partial class Default : System.Web.UI.Page
    {

        protected void Button1_Click(object sender, EventArgs e)
        {
          //textBox1.Text += wcf.function1();
          //textBox1.Text += wcf.function2();
          //textBox1.Text += wcf.function3();
          //only now the page updates.
        }
    }
}

通用处理程序的隐藏代码 (*.ashx.cs):

using System;
using System.Text;
using System.Web;
using System.Web.UI;
using System.Threading;

namespace DemoGenericHandler
{
    public class MyHandler : System.Web.IHttpHandler
    {

        public virtual bool IsReusable {
            get {
                return false;
            }
        }

        public virtual void ProcessRequest (HttpContext context)
        {
            //if you need get the value sent from client (ajax-post)
            //string valueSendByClient = context.Request.Form["data"] ?? string.Empty;

            //you must use a library like JSON.NET (newtonsoft) to serialize an object
            //here for simplicity i'll build the json object in a string variable:
            string jsonObj = "{\"Value1\": \"1\",\"Value2\":  \"2\",\"Value3\": \"3\"}";

            //await 5 seconds: (imitates the time that your wcf services take)
            Thread.Sleep(5000);

            //send the result to the client
            context.Response.ContentType = "text/json";
            context.Response.Write(jsonObj);
        }
    }
}

一次捕获：

ASP.NET 如何 post 在 postback 期间更新（我知道 postback 是如何工作的，但仍然......）

ASP.NET how to post updates during postback (I know how the postback works but still...)

.net

c#

asp.net

wcf

asp.net-ajax