在WebRequest中顯示加載文本

我的webform上有一個按鈕。單擊此按鈕將在onclick事件處理程序中執行HttpWebRequest。在請求之後，我們將來自請求的響應複製到HttpContext.Current.Response中，並將其發送給客戶端。在WebRequest中顯示加載文本

此Web請求可能需要一段時間（最多5秒，因爲它正在生成報告）。在此期間，除了瀏覽器進度條和旋轉的IE圖標（如果他們使用的是IE），用戶沒有任何跡象表明任何事情正在進行。所以我需要一個負載指示器，而這正在發生。

我試過使用JavaScript在按鈕的onclick事件（使用OnClientClick）期間觸發，並且，雖然這工作，我不知道如何找出Web請求完成時。由於我們只是將響應發送給客戶端，因此不會發生完整的回發。我試過在UpdatePanel中包裝按鈕並使用UpdateProgress，但是當我們將響應發送到HttpContext.Current.Response並調用Response.End（）時，我們在javascript中得到一個錯誤，因爲響應沒有形成良好（我們正在發送一個Excel表格供用戶下載）。

由於我們發回的文件供用戶下載，我不想彈出一個單獨的窗口，因爲在IE中它們會讓信息欄阻止下載。

這裏的任何想法？

來源

2008-10-08 Ray

作爲Professional AJAX.NET庫的替代方案，jQuery有一個非常好的方法來完成此操作。

看看this example的使用。NET PageMethod（如果可能的話在你的場景中）。

您在jQuery中定義了一個頁面方法調用，您可以在隱藏的div中加載您的加載...消息。

說出你想成功返回什麼回調（即當你的5秒報告產生時）然後隱藏加載和處理數據。

查看javascript on my contact page的示例（查看源代碼）。

我在頁面上有一個按鈕，添加jQuery onClick。
當點擊顯示一個隱藏的加載div時，會對採用表單參數的頁面方法進行ajax調用。
頁面方法確實發送電子郵件等，然後返回到我在那裏的onSuccess JavaScript方法的形式。
onSuccess隱藏加載格。

來源

2009-02-25 16:13:54

我過去使用的一個簡單的技巧是重定向到帶有動畫進度條（gif）的中間頁面，然後讓該頁面執行數據的REAL發佈。（或者甚至彈出一層上面帶有動畫的圖像和一個禮貌的消息，要求用戶等待一兩分鐘）

動畫gif的簡單反饋會給最終用戶造成錯覺，不停滯，他們會更耐心。

另一種方法是將數據交給工作線程，並立即返回一條消息，指出報告將在電子郵件準備好時通過電子郵件發送或在網站的「報告」部分提供。當報告完成時，這種方法缺乏即時通知的好處。

來源

2008-10-08 22:59:13

重定向頁面的問題是，您最終會在IE中看到醜陋的信息欄，導致它們無法下載文件。我不想在我們的網站上添加一個全新的部分以獲取報告。無論如何，這可能需要更長的時間。 – Ray 2008-10-09 01:39:02

這裏是我的解決方案：

下載並檢查免費Professional AJAX.NET庫的樣本。
編寫一個創建文件並將文件位置作爲參數返回的AjaxMethod。
編寫客戶端函數以在第2步調用方法。當此方法調用時顯示指示符。
編寫客戶端回調方法來隱藏指示器並顯示/下載用戶請求的文件。
添加你的客戶端函數調用你的按鈕元素。

當你在服務器端的方法結束你的回調將被調用。

希望這會有所幫助！

來源

2009-02-24 09:53:39 Canavar

我在這裏介紹的解決方案旨在展示一種方法，讓您在服務器端處理時顯示「正在加載...」框，並在服務器端處理完成時消失。

我會用非常基本的AJAX機制（在FF上測試，但IE應該也可以），即不使用像Prototype或jQuery或Dojo這樣的框架，因爲您沒有指定關於它們的知識。

爲了讓您更好地理解這個訣竅，以下僅僅是一個小例子，並不假裝是一個開箱即用的解決方案。我傾向於不表面，但我認爲一個更清晰的例子可以比許多單詞更好地解釋。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 
<html> 
    <head> 
    <title>First Example</title> 
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
     <style> 
      .hidden { 
       display: none; 
      } 
      .loadingInProgress { 
       color: #FFFFFF; 
       width: 75px; 
       background-color: #FF0000; 
      } 
     </style> 
    <script type="text/javascript"> 
     var httpRequest; 
     if (window.XMLHttpRequest) { // Mozilla, Safari, ... 
      httpRequest = new XMLHttpRequest(); 
      httpRequest.overrideMimeType('text/xml'); 
     } else if (window.ActiveXObject) { // IE 
      try { 
       httpRequest = new ActiveXObject("Msxml2.XMLHTTP"); 
      } 
      catch (e) { 
       try { 
        httpRequest = new ActiveXObject("Microsoft.XMLHTTP"); 
       } 
       catch (e) {} 
      } 
     } 

     if (!httpRequest) { 
      alert('Giving up :(Cannot create an XMLHTTP instance'); 
     } 

     httpRequest.onreadystatechange = function(){ 
      switch (httpRequest.readyState) { 
      case 1: // Loading 
       document.getElementById('loading').className = "loadingInProgress"; 
       break; 
      case 4: // Complete 
       document.getElementById('loading').className = "hidden"; 
       if (httpRequest.status == 200) { 
        // perfect! 
       } else { 
        // there was a problem with the request, 
        // for example the response may be a 404 (Not Found) 
        // or 500 (Internal Server Error) response codes 
       } 
       break; 
      } 
     }; 

     function go() { 
      httpRequest.open('GET', document.getElementById('form1').action, true); 
      httpRequest.send(''); 
     } 
    </script> 

    </head> 
    <body> 
     <div id="loading" class="hidden">Loading...</div> 
     <form id="form1" name="form1" action="doSomething.php"> 
      <input type="button" value="Click to submit:" onclick="go()" /> 
     </form> 
    </body> 
</html>

正如你所看到的，有一個<div>它包含「加載...」消息。

原理是顯示/隱藏<div>，具體取決於XMLHttpRequest對象的readyState。

我已使用的onreadystatechange處理程序觸發readyState更改。

我使用的後端php腳本（聲明爲表單的action）只做了一個睡眠（5），讓「加載...」消息出現5秒。

<?php 
sleep(5); 
header('Cache-Control: no-cache'); 
echo "OK"; 
?>

的Cache-control: no-cache頭是必要的，因爲通常如果不設置瀏覽器會緩存避免重新提交請求如果你需要的響應。

「入門」AJAX文檔的一個很好的來源是Mozilla MDC。

整個事情可以通過像Prototype這樣的Javascript框架輕鬆處理，利用其瀏覽器安全的方法，節省數小時的調試時間。

編輯：

我選擇了PHP的，因爲我不知道ASP.NET也不ASP，很抱歉。

來源

2009-03-02 13:47:09

在WebRequest中顯示加載文本

回答

相關問題