2013-05-21 84 views
8

我有一個ajax調用是抓住一個大json列表。有沒有什麼辦法可以讓進度條獲得json加載的實際價值(例如狀態欄上顯示的是1加載的200)?Ajax進度條與一個大列表

現在我有一個非常基本的AJAX調用

function SendAjax(urlMethod, jsonData, returnFunction) { 
    $.ajax({ 
     type: "GET", 
     contentType: "application/json; charset=utf-8", 
     url: urlMethod, 
     data: jsonData, 
     dataType: "json", 
     success: function (msg) { 
      if (msg != null) { 
       ReturnJson(msg); 
      } 
     }, 
     error: function (xhr, status, error) { 
      // Boil the ASP.NET AJAX error down to JSON. 

      var err = eval("(" + xhr.responseText + ")"); 

      // Display the specific error raised by the server 
      alert(err.Message); 
     } 
    }); 
} 

回答

2

在您的應用程序全局範圍上嘗試使用AjaxStart。這意味着你可以將代碼放在佈局文件,如果處理很長,它會顯示進度指示器...

$(document).ajaxStart(function() { 
    $("#loading").show(); 
}); 

你可以看到在preload with percentage - javascript/jquery的例子和答案。

+0

我可能最終會做這樣的事情。但是看起來更多的是「裝入77個項目」並計數直到它們全部被加載 – datatest

1

中有一個Ajax請求的幾個國家,但他們並不代表通過請求任何百分比。

網絡流量應該真的成爲你真正的問題,你不想發送200個單獨的請求(雖然這將允許一個進度條,這將使整個請求花費更長的時間,這取決於你的網絡連接服務器)。

您最好只顯示一個活動指示器,並在請求完成時將其移除,並嘗試優化代碼服務器端以儘可能快地返回200個項目。

如果200個項目實在是太大了(比X秒較大的返回),你可以把它的一半或四分之三分割顯示一些進步但是這樣會浪費時間與網絡上的那些額外的請求,網頁標題,等等。

0

如果您的服務器端代碼有共享應用程序狀態的方式(例如PHP中的$ _SESSION),您可以創建2個獨立的請求,一個請求數據,一個檢查第一個請求的進度。在計時器上重複第二個請求,直到第一個完成,並在處理每個項目時更新$ _SESSION(或者服務器代碼中的任何內容)。

例如: 初始頁面必須啓動一個會話,從而使隨後的AJAX調用小甜餅,並且可以訪問共享數據:

<?php 
session_start(); 
session_write_close(); // close the session so other scripts can access the file (doesn't end the session) 
// your page content here 
?> 

首先AJAX調用啓動處理:

<?php 
function updateSession($count){ 
    session_start(); // open the session file 
    $_SESSION['progress'] = $count; 
    session_write_close(); // let other requests access the session 
} 
// as you process each item, call the above function, ex: 
for ($i = 1; $i <= 10; $i++) { 
    updateSession($i); 
} 
?> 

二AJAX調用(重複每X秒)看起來像:

<?php 
session_start(); // open the session file 
echo @$_SESSION['progress'] or 0; // echo contents or 0 if not defined 
session_write_close(); // let other requests access the session 
?> 

對不起,我不知道ASP.NET,但希望上面的代碼對你有用。