Datatables Datatable—向表中插入JSON数据

我想将JSON数据插入到我的表中，但我可以让它正常工作，我不断遇到错误：

datatables为第0行请求了未知参数0

我从AJAX中获得的数据如下：

[
{
"log_time":"2015-12-27 09:42:21",
"user_name":"Me",
"class_name":"login",
"class_function":"authentication",
"action_title":"User login",
"action_description":"I am logged in"
},
{
"log_time":"2015-12-27 09:42:21",
"user_name":"me",
"class_name":"dashboard",
"class_function":"index",
"action_title":"Admin dashboard",
"action_description":"I am logged in"
}
]

---

你就快到了。关于添加

列

，我是对的，请参见以下工作指南：

基本上，您需要告诉DataTable如何处理您提供给它的数据，您还需要确保在响应的每个迭代中都没有清除数据；-）

告诉数据表数据的结构也有助于您单独添加每一行。您也可以添加整个数组（

myTable.clear（）.rows.add（logs.draw（）；

），而不是清除表，迭代日志中的行并添加每一行，然后绘制表

var jsonData = [{
    "log_time": "2015-12-27 09:42:21",
    "user_name": "Me",
    "class_name": "login",
    "class_function": "authentication",
    "action_title": "User login",
    "action_description": "I am logged in"
}, {
    "log_time": "2015-12-27 09:42:21",
    "user_name": "me",
    "class_name": "dashboard",
    "class_function": "index",
    "action_title": "Admin dashboard",
    "action_description": "I am logged in"
}];

var myTable = $('#my_logs').DataTable({
    "paging": true,
    "lengthChange": true,
    "searching": true,
    "ordering": true,
    "info": true,
    "autoWidth": true,
    "data": [],
    "columns": [{
        "title": "Date",
        "data": "log_time"
    }, {
        "title": "User Name",
        "data": "user_name"
    }, {
        "title": "Class",
        "data": "class_name"
    }, {
        "title": "Function",
        "data": "class_function"
    }, {
        "title": "Action",
        "data": "action_title"
    }, {
        "title": "Description",
        "data": "action_description"
    }]
});

$(document).ready(function() {
    $("#getResults").click(function() {
        $.ajax({
            url: '/echo/json/',
            data: {
                json: JSON.stringify(jsonData)
            },
            type: "POST",
            timeout: 30000,
            dataType: "json", // "xml", "json"
            success: function(logs) {
                myTable.clear();
                $.each(logs, function(index, value) {
                    myTable.row.add(value);
                });
                myTable.draw();
            },
            error: function(jqXHR, textStatus, ex) {
                alert(textStatus + "," + ex + "," + jqXHR.responseText);
            }
        });
    });
});

---

希望有帮助。

是因为表格不知道如何处理您的数据吗？也许可以在表的初始化中添加一个

列

函数？@IshanMahajan，您是否尝试单击按钮（

获取结果

）？这个问题表明数据是在点击按钮后获得的：-）希望有帮助。我的错。谢谢你的努力

var jsonData = [{
    "log_time": "2015-12-27 09:42:21",
    "user_name": "Me",
    "class_name": "login",
    "class_function": "authentication",
    "action_title": "User login",
    "action_description": "I am logged in"
}, {
    "log_time": "2015-12-27 09:42:21",
    "user_name": "me",
    "class_name": "dashboard",
    "class_function": "index",
    "action_title": "Admin dashboard",
    "action_description": "I am logged in"
}];

var myTable = $('#my_logs').DataTable({
    "paging": true,
    "lengthChange": true,
    "searching": true,
    "ordering": true,
    "info": true,
    "autoWidth": true,
    "data": [],
    "columns": [{
        "title": "Date",
        "data": "log_time"
    }, {
        "title": "User Name",
        "data": "user_name"
    }, {
        "title": "Class",
        "data": "class_name"
    }, {
        "title": "Function",
        "data": "class_function"
    }, {
        "title": "Action",
        "data": "action_title"
    }, {
        "title": "Description",
        "data": "action_description"
    }]
});

$(document).ready(function() {
    $("#getResults").click(function() {
        $.ajax({
            url: '/echo/json/',
            data: {
                json: JSON.stringify(jsonData)
            },
            type: "POST",
            timeout: 30000,
            dataType: "json", // "xml", "json"
            success: function(logs) {
                myTable.clear();
                $.each(logs, function(index, value) {
                    myTable.row.add(value);
                });
                myTable.draw();
            },
            error: function(jqXHR, textStatus, ex) {
                alert(textStatus + "," + ex + "," + jqXHR.responseText);
            }
        });
    });
});