Question

根据文档here，我实现了服务器端代码。

JS代码

$('#datatable_paging').dataTable({
        "bProcessing": true,
        "bServerSide": true,
        "sAjaxSource": "#### my php file path ####",
 });

我将JSON数据作为

{
    "sEcho": 0,
    "iTotalRecords": 19,
    "iTotalDisplayRecords": "19",
    "aaData": [
        ["1", "peter", "peter@gmail.com"],
        ["2", "john", "john@yahoo.com"],
        ["3", "raj", "raj@in.com"],
        ["4", "selvin", "selvin@gmail.com"],
        ["5", "ismail", "ismail@gmail.com"],
        ["6", "muadth", "muad@hotmail.com"],
        ["7", "ahmed", "ahmed@gmail.com"],
       .....
    ]
}

现在我需要使用Datatable分页

在下表中显示此JSON结果

HTML代码

    <table id="datatable_paging">
        <thead>
          <tr>
            <th>Id </th>
            <th>Name</th>
            <th>E-mail</th>                
          </tr>
        </thead>            
  </table>

Answer 1

回答这个问题的人过于沉溺于这种方式。当您正确设置选项时，数据表将处理输出而不需要任何花哨的循环/分配/ etc。假设您的JSON返回正确，如规范中所述：

HTML：

 <table id="datatable_paging"></table>

然后是jQuery：

var oTable = $('#datatable_paging').dataTable( {        
        "bDestroy":true,
        "bStateSave": true,
        "aaSorting": [[1, "asc"]], 
        "bProcessing": true,
        "bServerSide": true,
        "sAjaxSource": "#### my php file path ####",
        "bJQueryUI": true,
        "bAutoWidth": false,
        "bFilter":true,
        "bLengthChange": true,
        "bPaginate": true,
        "bSort": true,
        "iDisplayLength": 10,
        "bInfo": true,
        "sPaginationType": "full_numbers",
        "aoColumns": [
            { "sTitle": "Id", "sWidth": "33%"},
            { "sTitle": "Name", "sWidth": "33%"},
            { "sTitle": "Email", "sWidth": "33%"}
        ]
    })

假设你的PHP源正确地过滤它，应该正确设置分页等。例如，如果你发现当你得到10时你得到19个结果，你就会知道问题出在你的源头，而不是jQuery。在你的例子中，消息来源说它从19中返回了19个总结果并且没有指定bPaginate，所以这就是分页无效的原因。 aoColumns设置你的头脑，除非你真的想要，否则不需要用HTML。其他功能在数据表网站上有详细记录，但如果您感到困惑则提出问题。

Answer 2

您可以循环使用'aaData'并直接使用fnAddData添加新行。

点击此处查看：http://datatables.net/examples/api/add_row.html

编辑：也是一个例子。

var aaData = theVariableHoldingTheJsonObject.aaData;
$("#datatable_paging").dataTable().fnAddData ( aaData )

基本上就是

Answer 3

好像你应该在JSON中发回一个正确的“sEcho”变量。

DataTables需要知道有关要发回的数据的信息，以便能够呈现。您需要将已发送的值传回DataTables。

sEcho在这里描述：http://datatables.net/usage/server-side

所以为了得到你的例子工作，将“sEcho”改为1或更好，这样写：

"sEcho": int(request.vars['sEcho'])   #python code

如何使用DataTable插件将我的JSON数据显示到表中？

3 个答案: