【问题标题】:How to update a paginated jQuery DataTables data and show it如何更新分页的 jQuery DataTables 数据并显示它
【发布时间】:2019-01-02 11:07:01
【问题描述】:

我在更新 jQuery DataTable 的基础数据时遇到问题。稍微解释一下,在非分页行的情况下,我可以使用 jQuery 选择行,更新它并重绘 DataTables 中的更改,如下所示table.row($('#item' + item.id)).invalidate().draw();

但是,在分页(不可见)行的情况下,我无法使用 jQuery 选择它们以进行更新,因为 DataTables 会将它们从 DOM 中删除并将它们保存在其他地方。我需要这个,因为在我的一个可见行中的编辑会影响其他行中的值,我希望能够反映更改。

以下是我失败的尝试之一:

我尝试遍历数据、更新数据并重新绘制表格,如下所示:

table.rows().iterator('row', function (context, index) {
    if (this.row(index).data()[0] == item.id /*item is a variable*/) {
        this.row(index).data()[3] = item.qty;
        console.log(this.row(index).data());
        this.row(index).draw();
    }
});

数据按我想要的方式记录,但更改未显示在 DataTable 上,这让我认为这可能不是正确的方法。

请帮忙!

【问题讨论】:

    标签: javascript jquery datatables datatables-1.10


    【解决方案1】:

    您可以使用ajax修改您的后端数据源,然后修改reload表数据。

    【讨论】:

    • 您的答案也有效,但我认为重新加载整个表的数据只是为了更新一行中的单个值是昂贵的。除此之外,我已经有了要更新的行的新数据。我想要的是更新表中单个分页行的值。不过感谢您的努力!
    • 这种方法由简单的逻辑决定——一旦进行更新,您必须注意让所有用户都在同一页面上。
    【解决方案2】:

    终于找到了无需使用jQuery的解决方案:

    let idData = table.column(0).data();
    let idx = idData.indexOf(item.id);
    
    if (idx >= 0) {
        stocksTable.row(idx).data([item.id, item.name, item.desc, item.quantity])).draw(false);
    }
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2019-10-04
      • 1970-01-01
      • 1970-01-01
      • 2013-12-09
      • 2016-11-21
      • 2016-10-03
      • 2014-08-14
      • 1970-01-01
      相关资源
      最近更新 更多