jquery DataTable 无法读取 JSON 数据
Posted
技术标签:
【中文标题】jquery DataTable 无法读取 JSON 数据【英文标题】：jquery DataTable cant read JSON data 【发布时间】：2018-12-27 07:47:46 【问题描述】：我的 JSON 包含字符串和整数值。 html 表列与 DataTable 列匹配。 DataTables 数据正在通过 ajax 加载。一切似乎都很好，但我收到错误
DataTables warning: table id=blackListMailTable - Requested unknown parameter 'Id' for row 0, column 0. For more information about this error, please see http://datatables.net/tn/4
HTML：
<div class="col-lg-12">
<h3>All Black List Mails</h3>
<hr />
<br />
<table id="blackListMailTable" class="table table-bordered table-hover">
<thead>
<tr>
<th>ID</th>
<th>Email</th>
<th>Module</th>
<th>Status</th>
</tr>
</thead>
<tbody></tbody>
</table>
</div>
数据表代码：
//making the table
var table;
if ($.fn.dataTable.isDataTable('#blackListMailTable'))
table.ajax.reload();
else
table = $("#blackListMailTable").DataTable(
ajax:
url: ".....",
method: "GET",
dataSrc: ""
//success: function (data)
// console.log(data);
//,
,
columns: [
data: "Id" ,
data: "Email" ,
data: "Module" ,
data: "Status"
]
);
我使用 ajax 调用的成功选项测试了 JSON 数据。在浏览器控制台中我得到了这个 JSON：
[
"Id":1,
"Email":"***",
"Module":"MailChimp",
"Status":"Unsubscribed"
,
"Id":2,
"Email":"***",
"Module":"MailChimp",
"Status":"Unsubscribed"
,
"Id":3,
"Email":"***",
"Module":"MailChimp",
"Status":"Unsubscribed"
,
"Id":4,
"Email":"***",
"Module":"MailChimp",
"Status":"Unsubscribed"
,
"Id":5,
"Email":"***",
"Module":"MailChimp",
"Status":"Unsubscribed"
,
"Id":6,
"Email":"***",
"Module":"MailChimp",
"Status":"Unsubscribed"
,
"Id":7,
"Email":"***",
"Module":"MailChimp",
"Status":"Bounced"
,
"Id":10002,
"Email":"***",
"Module":"MailChimp",
"Status":"Bounced"
,
"Id":10003,
"Email":"***",
"Module":"MailChimp",
"Status":"Unsubscribed"
]
我尝试使用mData，但没有运气。我做错了什么？
【问题讨论】：
jsonResponse 中是否有任何列值为空白？ 【参考方案1】：试试这个可能有些字段没有数据
columns: [
data: "Id",defaultContent: '' ,
data: "Email",defaultContent: '' ,
data: "Module",defaultContent: '' ,
data: "Status",defaultContent: ''
];
否则删除
dataSrc:""
【讨论】：
【参考方案2】：如果您的 jsonResponse 包含一些 null 或空白值，那么您可以将 defaultContent 添加到您的 columns。类似于mysql的默认值。
table = $("#blackListMailTable").DataTable(
ajax:
url: ".....",
method: "GET",
dataSrc: ""
//success: function (data)
// console.log(data);
//,
,
columns: [
data: "Id" , defaultContent: "" ,
data: "Email", defaultContent: "" ,
data: "Module", defaultContent: "" ,
data: "Status", defaultContent: ""
]
);
我可以看到的另一个问题是： 正如你使用的那样
if ($.fn.dataTable.isDataTable('#blackListMailTable'))
table.ajax.reload();
这个函数检查
如果#blackListMailTable 是一个数据表。 "如果是，初始化："
所以，它会抛出重新初始化错误。解决在您的 if 中添加 ! 而不是条件的问题。
if (!$.fn.dataTable.isDataTable('#blackListMailTable'))
table.ajax.reload();
意思是：
如果#blackListMailTable 是一个数据表。 "如果没有，初始化：
【讨论】：
以上是关于jquery DataTable 无法读取 JSON 数据的主要内容，如果未能解决你的问题，请参考以下文章
未捕获的类型错误：无法读取 JQuery DataTable 未定义的属性“mData”
jQuery DataTables 错误 - TypeError：无法读取未定义的属性“fnInit”