Ajax请求Datatables中每个页面的服务器端数据 [英] Ajax request for server side data for each page in Datatables

问题描述

我正在使用Jquery Datatables来加载从服务器端通过ajax调用获得的数据数组（aaData）数组。我不想立即拉出整个数据，而我需要在每次用户点击Datatables分页中的prev或next时，要求ajax加载数据。

I am using Jquery Datatables to load an array of array of data (aaData) obtained via ajax call from server side. I don't want to pull whole of the data at once rather I need to make ajax request for loading data every time user clicks "prev" or "next" in Datatables pagination.

如何实现这一点？我想要一个ajax调用，并且仅在该页面上即时获取结果。

How can this be achieved ?I want to make an ajax call and fetch results on the fly for that page only.

以下是我在正在打电话。

Below is the javascript code where in I am making a call.

$.ajax({              
 type: "GET",
 url: "ajaxBacklog",
 contentType: 'application/json',
 data: null,
 dataType: 'json',
 success: function(json){                  
     oTable = $("#backlogTable").dataTable({
         "aaData": json.aaData,
         "bProcessing": true,
         "bServerSide": true,
         "sPaginationType": "full_numbers",
         "bJQueryUI": true,
         "bRetrieve": true,
         "bPaginate": true,
         "bStateSave": true,
         "bSort": true,
         "aaSorting": [[ 4, "desc" ]],
         "iDisplayLength": 25,
         "oLanguage": {
                 "sProcessing": "<img src='resources/images/loader.gif'/>",
                 "sEmptyTable": "No records found."
             },
         "aoColumns": [
             { "sClass": "alignCenter"},
             { "sClass": "left"},
             { "sClass": "left"},
             { "sClass": "left"},
             { "sType": 'date-uk', "sClass":"datecolumn"},
             { "sType": 'date-uk', "sClass":"datecolumn"},
             { "sClass": "left"},
             { "sClass": "left"}
         ],
         "error": function() {
             alert("Failed to load Data");
         }
     });
    }
   }
);

我也按照服务器端处理，但没有任何工作。

I have also followed the server side processing of datatables as well but nothing is working.

推荐答案

在数据库服务器端处理每个点击prev/next按钮（也可以过滤，排序等）调用请求（开箱即用）到 sAjaxSource 属性 - 您可以在浏览器控制台中查看此调用。

In datatables server-side processing every click on 'prev'/'next' button (also filter, sorting etc) call request (out of the box) to function specified in sAjaxSource property - you can check this call in your browser console.

调用有很多有用的参数。您需要在您的函数中使用 iDisplayLength 和 iDisplayStart 进行剪切（排序和过滤）您的数据集 iDisplayStart to iDisplayStart + iDisplayLength 。

Call have lot of usefull parameters. You need to use iDisplayLength and iDisplayStart in your function for cut (after sort and filter) your set of data from iDisplayStart to iDisplayStart+iDisplayLength.

更改您的代码结构，您可以在数据表文档中看到 - 定义数据表初始化代码，并在 sAjaxSource 属性中指示ajax源。

You should of course change your code structure as you can see in datatables documentation - define datatables initialization code and indicate ajax source in sAjaxSource property.

这篇关于Ajax请求Datatables中每个页面的服务器端数据的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！