Question

希望有人可以为我访问此文件，因为我无法弄清楚。

已成功接收数据，但是数据不会加载到表中。没有错误信息。只是根本不会做。以前，当我在DataTable中使用ajax调用时，此方法有效，但是当我将Ajax调用移至DataTable创建之外时，则不起作用。

示例JSON数据：

{
    "data":[
        {
            "Id": 1,
            "Name": "Fred"
        },
        {
            "Id": 2,
            "Name": "Tommy"
        }
    ]
}

获取JSON的函数调用：

function getJSON() {
    $.ajax({
        url: "Home/GetList",
        type: "GET",
        datatype: "json"
    }).done(function(data) {
        drawDataTable('Table', data);
    });
}

绘制数据表

function drawDataTable(divId, data) {
    var table = $('#' + divId).DataTable({
        data: data,
        dataSrc: "",
        columnDefs: [
            { "targets": [0], "data": "Id" },
            { "targets": [1], "data": "Name" }
        ]
    });
    return table;
}

然后我通过function drawDataTable(divId, data)将这个大数据数组（1000个数组元素）发送到我的Datatable函数中

在该DataTable函数中，我使用：

data: data,
dataSrc: ""

我还尝试了删除dataSrc并将其制作为dataSrc: "data"的方法，但是都没有起作用。

Answer 1

我认为您错过了JSON的结构，请尝试 data.data

 function drawDataTable(divId, data) {
        var table = $('#' + divId).DataTable({
            data: data.data, //updated here
            dataSrc: "",
            columnDefs: [
                { "targets": [0], "data": "Id" },
                { "targets": [1], "data": "Name" }
            ]
        });
        return table;
    }

Answer 2

确保您正在此函数中编写代码

$(document).ready(function() { 
// your code
}

因为在此以外编写的任何内容都可能无法正常工作，尤其是在使用 dataTables时。

此外，您可以通过以下方式编写此代码（如果有帮助的话）

$(document).ready(function() {
   function drawDataTable(divId,data) {
   var t = $('#'+ divId).DataTable();
   var dataObj = JSON.parse(data);
   dataObj.forEach(element => {
      t.row.add([
            element.Id,
            element.name
         ]).draw(false)
    });
 }})

将JSON数据添加到DataTable

2 个答案: