4

所以表格在页面上


<table width="100%" id="ticketListTable" class="genmed"></table>

然后我使用 AJAX 返回数据


$.ajax({
    type: 'POST',
    url: "ticketAjax.php",
    data: '&m=swapTicketList',
    dataType: "json",
    success: function(resultData) {
        $('#ticketListTable').dataTable({
            "aaData": resultData,
            "aaSorting": [[0, "desc"]],
            "bJQueryUI": true,
            "bScrollInfinite": true,
            "bScrollCollapse": true,
            "bDestroy": true,
            "bDeferRender": true,
            "iDisplayLength": 100,
            "sScrollY": "1000px",
            "sDom": "Rlfrtip",
        });
    }
});

AJAX 正在工作并返回


[{"ID":["17316","17314","17313","17312","17311","17310","17309","17308","17307"....

但是 aaData 没有使用该 Json 数据填充表。我误解了这是如何工作的吗？我已经阅读了很多论坛和帖子，它们似乎都导致了这种类型的使用。

4

2 回答 2

2

您需要为数据而不是对象提供数组数组。还要定义你的列。子数组将代表单独的行，主数组包含所有行

遵循JS Array示例

http://www.datatables.net/release-datatables/examples/data_sources/js_array.html

aaData注意提供给并遵循该结构的嵌套数组结构

于 2013-03-29T18:44:44.673 回答
1

好的，所以这并不像我想象的那么容易。在 AJAX 中，我必须构建数组，然后在另一个数组中使用 json_encode 返回它。

json_encode(array('tickets' => $tickets)) //-- WHERE $tickets = array(array(1, 'Options 1'), array(2, 'Options 2'))

我还必须将列标题作为数组返回

json_encode(array('tickets' => $tickets, 'headers' => $headers)) //-- WHERE $headers = array('ID', 'Options', etc..)

$headers 中的元素数量必须与 $tickets 匹配，否则它不会初始化表。

然后标题的JS部分是

            aoColumnArray = [];
        $.each(resultData.headers, function(index, value) {
            var aoColumns = new Object;
            aoColumns['sTitle'] = value;
            aoColumns['sClass'] = 'genmed';
            aoColumnArray.push(aoColumns);
        });

现在构建数据表对象

            ticketTable= [];
        ticketTable.aaData = resultData.tickets;
        ticketTable.aaSorting = [[0, "asc"], [1, "desc"], [2, "desc"]];
        ticketTable.aoColumns = aoColumnArray;
        ticketTable.bJQueryUI = true;
        ticketTable.bScrollInfinite = true;
        ticketTable.bScrollCollapse = true;
        ticketTable.bDestroy = true;
        ticketTable.bDeferRender = true;
        ticketTable.iDisplayLength = 50;
        ticketTable.sScrollY = '400px';
        ticketTable.sDom = 'Rlfrtip';
        $('#ticketTable').dataTable(ticketTable);

使用您要使用的选项。重要的部分是正在处理的 resultData。aaData 和 aoColumns 是使用 AJAX 数据的地方。顺便说一下，这一切都是在ajax调用的成功函数中初始化的。

希望它会帮助别人！

于 2013-04-04T19:36:29.430 回答