DataTable().ajax.reload() 未重新加载 table

Question

我正在使用 jQuery 附加函数将行填充到 table 正文中，这工作正常，但是当我尝试从 table 中搜索任何数据时，table被清除。

这是我的代码。

for (i = 0; i < mapping.length; i++) {
    var tr = $('<tr>' + '<td>' + ' <input type="checkbox" '
            + ' onchange="selectItem(this);" '
            + (mapping[i]['selected'] == true ? "checked" : "")
            + ' data-el_id="' + mapping[i]['id'] + '">'
            + ' </td>' + ' <td>' + mapping[i]['name'] + ' </td>'
            + ' <td>' + mapping[i]['itemName'] + ' </td>' + ' <td>'
            + mapping[i]['url'] + ' </td>' + ' </tr>');
    $("#tableBody").append(tr);
}

Answer 1

你应该使用 DataTable.row.add()。示例：

$yourDataTables.row.add([
counter + '.1',
counter + '.2',
counter + '.3',
counter + '.4',
counter + '.5']).draw();

Answer 2

您需要遍历数据表 API 才能插入行。我猜你的数据项看起来像这样：

{
    "selected": true,
    "id": 42,
    "name": "test",
    "itemName": "item"
}

然后，如果您像这样初始化 table :

var table = $('#example').DataTable({
    columns : [
        { data: 'selected',
          render: function (data, type, full, meta) {
              var input = '<input type="checkbox" onchange="selectItem(this);" ';
              input += data == true ? "checked" : "";
              input += ' data-el_id="' + full.id + '">';
              return input
          }
        },
        { data: 'name' },
        { data: 'itemName' }
    ]
});

您可以循环插入所有行：

for (i = 0; i < mapping.length; i++) {
   table.row.add(mapping[i]).draw();
}

小演示 -> http://jsfiddle.net/fu0r4oba/

DataTable().ajax.reload() 未重新加载 table

DataTable().ajax.reload() not reloading table

ajax

jquery

datatables