【发布时间】：2011-07-12 08:11:01
【问题描述】：
我正在使用DataTables 的服务器端处理。使用 Firefox 似乎一切正常。但是，当我使用 Chrome 查看表格时，没有显示任何行，并且 DataTable 的“处理中...”状态标签不清除。显示了表格的页眉、页脚和列名，但没有行。
在 Chrome 中，如果我右键单击表格，选择检查元素，然后选择控制台，我看不到任何错误、警告或日志。
表格的所有 HTML 看起来都是正确的，问题似乎是我认为 DataTables 没有在标签之间放置任何内容。
是否有一些我可以查看的日志或可以用来获取更多诊断信息的工具？
什么会阻止 DataTables 将从 JSON 记录中获得的内容添加到 tbody 部分？
几天前我才开始使用 Javascript、Jquery 和 DataTables，我不确定如何追踪问题并解决它。一些指针将不胜感激。
这是我的 DataTable 声明：
<script type="text/javascript">
/* <![CDATA[ */
$(document).ready(function() {
var oTable = $('#cars-table').dataTable({
"bAutoWidth": false,
"bJQueryUI": true,
"sPaginationType": "full_numbers",
"bProcessing": true,
"bStateSave": true,
"bServerSide": true,
"sAjaxSource": "/cars/get_cars_list/",
"iDisplayLength": 10,
"fnServerData": function ( sSource, aoData, fnCallback ) {
aoData.push({ "name": "where_select_box", "value": $("#select_box option:selected").val() } );
$.getJSON( sSource, aoData, function (json) {
fnCallback(json)
});
},
"aoColumnDefs": [
{ "aTargets": [0], "bVisible": false, "bSearchable": false},
{
"aTargets": [1],
"fnRender": function ( oObj ) {
return '<a href=\"/cars/' + oObj.aData[0] + '/\">' + oObj.aData[1] + '</a>';
},
"bSearchable": true,
},
{ "aTargets": [2], "bSearchable": true},
{ "aTargets": [3], "bSearchable": false, "sType": 'date'},
{ "aTargets": [4], "bSearchable": false},
{ "aTargets": [5], "bSearchable": false},
]
});
/* Select box */
$('#select_box').change(function() {
// Reload data based on choice
oTable.fnDraw();
});
} );
/* ]]> */
</script>
如果我启动 Firebug，控制台会显示作为 JSON 数据结构返回的数据，但这些数据永远不会显示在 Chrome 中，但会显示在 Firefox 中。
这是重新调整的 JSON（数据更改为客户机密）
{
"sEcho": 1,
"iTotalRecords": 1049,
"iTotalDisplayRecords": 1049,
"aaData":[
[
"1",
"car1",
"Ford",
"2",
"2011-12-18",
"159",
]
,
[
"2",
"car2",
"BMW",
"2",
"2011-12-18",
"159",
]
,
.
.
.
]
}
这是我执行“查看源代码”时表格的 HTML - 你可以看到 tbody 是空的。
<div style="width:75%;">
<div class="demo_jui">
<table id="cars-table" style="width:100%;" class="display" id="example">
<thead>
<tr class="gradeA">
<th>
ID
</th>
<th>
Name
</th>
<th>
Manufacturer
</th>
<th>
Size
</th>
<th>
Date
</th>
<th>
Days
</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
</div>
【问题讨论】：
-
你能告诉我们返回的 json 和谷歌浏览器中生成的标记（或页面链接以便我们查看吗？）
-
@Nicola Peluchetti 我更新了问题。谢谢。
-
也许 chrome 对代码中那些多余的逗号 ' , ' 很挑剔，检查 firefox "html validator" 的扩展是否没有错误，并且如果两者都显示 no，则 firebug 一切正常错误，也许它会对chrome有所帮助
-
@max4ever 尝试删除逗号，但不幸的是没有任何区别。我将尝试使用 html 验证器。谢谢。
-
@max4ever - 我想你修好了！！！当您提到太多逗号时，我认为您的意思是在我的 DT 声明中。但是，我刚刚从我的 JSON 模板中取出了最后一个，这修复了它！谢谢！请添加答案，以便我将其标记为正确。
标签： jquery google-chrome datatables