我要创建具有动态列和数据的DataTable。
我的html代码:
<body>
<table id="example" class="display">
</table>
</body>
我的数据.json:
{
"Category": {
"0": "Bags",
"1": "Shoes",
"2": "School",
"3": "Video-Games",
"4": "PC-Games"
},
"Price": {
"0": 10,
"1": 20,
"2": 30,
"3": 40,
"4": 50
}
}
在这一点上,我想类别和价格是列。
我的js代码是:
$(document).ready(function name(params) {
$.ajax({
url: "data.json",
method: 'get',
dataType: 'json',
success: function (response) {
var columns = Object.keys(response).map(function (key) {
return { title: key };
});
$('#example').DataTable({
data: Object.values(response),
columns: columns
});
},
error: (error) => {
console.log(JSON.stringify(error));
}
});
});
我想要以下结果
但我收到了这个
1条答案
按热度按时间dtcbnfnu1#
该文档建议的
data
和columns
略有不同。对于每一列,必须指定要使用的数据及其title
每一行都必须是一个对象,它由分配给它的列
data
来键控。我承认DataTables文档导航起来有点不直观...但是它是非常完整的。
下面是 AJAX
success
回调中应该包含的代码。第一个