Datatables-两个不同的json源在一起

Datatables - 2 different json sources together

本文关键字：json 在一起两个 Datatables- 更新时间：2023-09-26

我有2个数据表jsfiddle和3个json源。它工作得很好。

但我需要更改所有json文件：

原件：

{
    "data": [{
        "id": "11",
        "cat1": "add1.1",
        "cat2": "add1.2",
        "cat3": "add1.3"
    }, {
        "id": "12",
        "cat1": "add2.1",
        "cat2": "add2.2",
        "cat3": "add2.3"
    }]
}

新增：删除前2行中的{"data":和最后一行的}

[{
    "id": "11",
    "cat1": "add1.1",
    "cat2": "add1.2",
    "cat3": "add1.3"
}, {
    "id": "12",
    "cat1": "add2.1",
    "cat2": "add2.2",
    "cat3": "add2.3"
}]

我希望如果删除jsfiddle中的.data，并将"ajax": url更改为：

"ajax": {
    "url": url,
    "dataSrc": ""
},

这将是工作。

原件：

$.when(call1, call2).done(function(a1, a2){
        var data = a1[0].data;
        data.splice.apply(data, [2, 0].concat(a2[0].data));
        drawTable("#tab1","",data)
    }); 
drawTable("#tab2","https://api.myjson.com/bins/4lpow","")
function drawTable(id, url, data) {
    $(id).dataTable( {
     "ajax": url,
     data: data,
     columnDefs: [
        { className: "hide", "targets": [ 0 ] },
     ], 
     order: [],
     ordering: false,        
     columns: [
        { "data": "id"},
        { "data": "cat1"},
        { "data": "cat2"},
        { "data": "cat3"}
     ]
  });
}

新增：

$.when(call1, call2).done(function(a1, a2){
        //removed .data
        var data = a1[0];
        //removed .data
        data.splice.apply(data, [2, 0].concat(a2[0]));  
        drawTable1("#tab11","",data)
    }); 
drawTable1("#tab21","https://api.myjson.com/bins/3tuls","")
function drawTable1(id, url, data) {
        $(id).dataTable( {
        "ajax": {
            "url": url,
            "dataSrc": ""
        },
         data: data,
         columnDefs: [
            { className: "hide", "targets": [ 0 ] },
         ], 
         order: [],
         ordering: false,        
         columns: [
            { "data": "id"},
            { "data": "cat1"},
            { "data": "cat2"},
            { "data": "cat3"}
         ]
      });
   }

问题是，它与jsfiddle:中的警告一起工作

请使用POST请求

如果我在本地测试这个文件，警告是：

DataTables警告：table id=tab11-无效的JSON响应。有关此错误的详细信息，请参阅http://datatables.net/tn/1

在drawTable1函数中不能同时提供ajax和data选项。

请使用以下代码：

function drawTable1(id, url, data) {
    var opt;
    if (url !== "") {
        opt = {
            ajax: {
                url: url,
                dataSrc: ""
            }
        };
    }
    if (data !== "") {
        opt = {
            data: data
        }
    }
    $(id).dataTable($.extend({
        columnDefs: [{
            className: "hide",
            targets: [0]
        }, ],
        order: [],
        ordering: false,
        columns: [
            { "data": "id"},
            { "data": "cat1"},
            { "data": "cat2"},
            { "data": "cat3"}
        ]
    }, opt));
}