DataTables 1.10 伺服器端處理

示例表

有幾種方法可以將資料注入 DataTables。Serverside Processing 只是一種方法。通過這種方式,DataTables 具有預先配置的端點以從中檢索資料,並且該端點負責接受 DataTable 應用的所有分頁/過濾/排序請求。這與從伺服器傳送完整資料集並讓 DataTables 根據你的使用情況在客戶端完成這一點有各種利弊。

var tbl = $('#example').DataTable({
  processing: true,
  serverSide: true,
  ajax: {
    url: '/echo/json/',
    method: 'post'
  },
  columns: [{
    data: 'First',
    title: 'First Name'
  }, {
    data: 'Last',
    title: 'Last Name'
  }]
});

掛鉤 preXhr 事件以向 ajax 請求傳送附加資料的示例

此事件在進行 ajax 呼叫之前直接觸發,允許你修改請求正文。如果存在影響返回到表的資料的表單(設想可能在日期範圍內或類似範圍內過濾的最小/最大條),這將非常有用。

tbl.on('preXhr.dt', function(ev, settings, data) {
    $.extend(data, {
      min: $('form [name=min]').val(), 
      max: $('form [name=max]').val()
    });
});

處理請求的伺服器端要求的說明

在典型的 DataTables 無選項例項中,所有過濾,排序和分頁都在客戶端瀏覽器中處理。啟用 S​​erverside Processing 後,這些任務將轉移到 Web 伺服器。對於非常大的資料集,這些資料集可能無法完整地傳送到客戶端,這可以提供幫助。

配置 ajax 端點時,Datatables 請求會傳送幾個預設引數。它可以變得非常長,因此,不是逐項列出,而是對伺服器職責的一般概述可能更有幫助。

從你可能提供給請求的任何可選引數開始,編譯資料集併為 DataTables 操作做好準備。使用 search[value]search[regex] 引數對所有列/屬性應用任何過濾。單個列過濾器也有 columns[i][search][value]columns[i][search][regex] 引數,但這些引數在 DataTables 的簡單例項中並不常用。

使用各種 order 引數對過濾後的資料進行排序。與搜尋引數一樣,每列將有一組排序引數,在這些引數上啟用排序。order[i][column]order[i][column][dir]

一旦過濾和排序完成,就可以使用 startlength 引數根據 DataTables 請求分頁資料。在 .NET 中,這可能看起來像:

int start = Int32.TryParse(Request["start"]);
int length = Int32.TryParse(Request["length"]); 
return MyData.Skip(start).Take(length);

示例響應

這是 DataTables 期望的粗略響應結構。無論你的資料是什麼(2d 陣列,物件陣列等)巢狀在 data 屬性中,其他屬性都會播放 DataTable 的核心以繪製有關分頁和過濾的資訊(例如“顯示記錄 11-20 of 500(從 1000 過濾)” )

{
  "draw": 1,
  "recordsTotal": 57,
  "recordsFiltered": 57,
  "data": [/*your data goes here*/]
}

另請參閱 .rows.add(data)data 選項, 瞭解使用 JSON 資料設定 DataTable 內容的替代方法。當然,DataTables 也可以從靜態 HTML 或 HTML5 data- 屬性初始化