jQuery dataTable AJAX填充
jQuery dataTable AJAX填充
提问于 2013-03-30 02:22:30
所以表格在页面上
<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数据来填充表。我是不是误解了它的工作原理？我读过不少论坛和帖子，它们似乎都导致了这种用法。
回答 2
Stack Overflow用户
回答已采纳
发布于 2013-04-05 03:36:29
好吧，这并不像我想的那么简单。在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);
});现在构建datatable对象
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调用的成功函数中初始化的。
希望它能帮助其他人！
Stack Overflow用户
发布于 2013-03-30 02:44:45
您需要为数据而不是对象提供数组的数组。还要定义您的列。子数组将表示单个行，主数组包装所有行
遵循JS Array示例
http://www.datatables.net/release-datatables/examples/data_sources/js_array.html
注意提供给aaData的嵌套数组结构，并遵循该结构
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/15709118
复制相关文章
相似问题
腾讯云开发者
