使用JQuery创建dataTable。我究竟做错了什么?

时间:2017-09-12 14:30:29

标签: jquery arrays json ajax datatable

我尝试过多种方法让它发挥作用。

这是我导入的内容:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js">
</script>

<script type="text/javascript" src="https://cdn.datatables.net/1.10.16/js/jquery.dataTables.min.js" ></script>
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.16/css/jquery.dataTables.min.css" />

这是我的代码

var myUrl = "test.php";
$(document).ready(function() {
    $('#ajax-content').DataTable({
        "ajax": myUrl,
        "columns": [
            { "data": "id"},
            { "data": "navn"},
            { "data": "timeStamp"},
            { "data": "logged_in"},
            { "data": "display_status"},
            { "data": "logo"}
        ]
    });
});

这是我的JSON

{
    "2": {
        "navn": "Henry",
        "timeStamp": "1505222637",
        "logged_in": "not online",
        "display_status": "Doesn't work",
        "logo": "someURL"
    },
    "5": {
        "navn": "Diana",
        "timeStamp": "1505224159",
        "logged_in": "Online",
        "display_status": "Works",
        "logo": "anotherURL"
    }
}

如果没有dataTable就可以完成它。我怀疑我的问题是当我执行代码的第一段时。当我尝试做我的JQuery时。

如果有人能帮我提出解决方案,我将不胜感激:(

更新: 忘了发布它给我的错误的图片

https://i.imgur.com/TqjpeQG.png

1 个答案:

答案 0 :(得分:0)

当使用数据填充表时,jQuery datatables插件需要arrayarray of objects。您正在提供JSON中的对象,这是一种它不期望的格式 - 从而导致插件中断。

有几种方法可以解决这个问题:

  • 更新您的API端点以返回正确的格式。
  • 手动将对象映射到数组中(如果您需要手动解析对象,则Underscore / Lodash具有非常有用的实用程序功能)