我已经看到了这个问题的几个例子,但仍然无法找到解决方案。
该错误表明它在下面显示的第3287行的jquery.dataTables.js(版本1.10.4)上中断了
// Got the data - add it to the table
for ( i=0 ; i<aData.length ; i++ ) {
_fnAddData( settings, aData[i] );
}
这是我的控制器。控制器是这种方式,因为现在缺少数据库连接,但将以与$ data相同的格式返回JSON。我已经尝试了几个方法来解决错误,但继续遇到其他问题。 JSON有效。
public function test()
{
$data = '{"persons": [{"branch": "CORP","phone_numbers": [{"desk": "5223422117"},{"mobile": "5022319224"},{"branch": "422-922-2291"}],"email": "twilliams@test.com","preferred_name": "Thomas","person_id": 368,"department": "IT","first_name": "Thomas","title": "Programming Manager","last_name": "Williams"}]}';
$data = json_encode($data);
echo $data;
}
我的javascript
$(document).ready(function() {
$('#directory_table').dataTable( {
"ajax": {
"url": "test",
"type": "JSON"
},
"aoColumns": [
{ "persons": "preferred_name" },
{ "persons": "last_name" },
{ "persons": "phone_numbers.0" },
{ "persons": "phone_numbers.1" },
{ "persons": "phone_numbers.2" },
{ "persons": "email" },
{ "persons": "department" },
{ "persons": "title" }
]
} );
} );
我的HTML
<table id='directory_table' class="display">
<thead>
<tr style='background: #186A9F; color: white;'>
<th>First Name </th>
<th>Last Name</th>
<th>Desk Number</th>
<th>Mobile</th>
<th>Branch</th>
<th>Email</th>
<th>Department</th>
<th>Title</th>
</tr>
<thead>
</table>
答案 0 :(得分:9)
默认情况下,DataTables期望JSON响应具有特定结构,请参阅documentation。
数组数组:
{
"data": [
[ "value1", "value2" ],
...
]
}
对象数组:
{
"data": [
{
"attr1": "value1",
"attr2": "value2"
},
...
]
}
发生错误,因为包含对象数组(persons
)的响应中的数据属性名称与默认值(data
)不同。
使用ajax.dataSrc
选项从数据源对象(即Ajax请求返回的)中定义属性以进行读取。
$('#directory_table').dataTable( {
"ajax": {
"url": "test",
"dataSrc": "persons"
},
"columns": [
{ "data": "preferred_name" },
{ "data": "last_name" },
{ "data": "phone_numbers.0.desk" },
{ "data": "phone_numbers.1.mobile" },
{ "data": "phone_numbers.2.branch" },
{ "data": "email" },
{ "data": "department" },
{ "data": "title" }
]
});
或者,如果您可以将JSON响应中的数据属性名称从persons
更改为data
,则不需要添加"dataSrc": "persons"
。
请参阅this jsFiddle以获取代码和演示。
有关此错误和其他常见控制台错误的详细信息,请参阅jQuery DataTables: Common JavaScript console errors。