首页 文章

更新DataTables行数据

提问于
浏览 次
1

我在我的网站上使用了数据表 .

现在每当我更新任何单个记录的任何数据时，我只需使用ajax更新该行数据：

HTML is like:

<table class="datatable">
    <tr id="user_row_1">
        <td>Name 1</td>
        <td>Role 1</td>
        <td>XYZ 1</td>
    </tr>
    <tr id="user_row_2">
        <td>Name 2</td>
        <td>Role 2</td>
        <td>XYZ 2</td>
    </tr>
    <tr id="user_row_3">
        <td>Name 3</td>
        <td>Role 3</td>
        <td>XYZ 3</td>
    </tr>
</table>

Jquery is like:

oTable = $(".datatable").DataTable();
....
$("#user_row_3").html(response);

Ajax response code:

<td>Name 3 Updated</td>
<td>Role 3 Updated</td>
<td>XYZ 3 Updated</td>

Problem

但是当我使用datatable api检索数据时：

var table = $('#user-list').DataTable();
var rowData= table.row('#user_row_160').data();
$.each($(rowData),function(key,value){
    console.log(value["name"]); 
});

它返回旧数据 .

那么如何准确更新数据表行 .

jquery datatables

1 回答

  • 2

    在更改单元格或整行的值时，也应始终使用API：

    table.row("#user_row_3").data(response).invalidate().draw()

    DataTables没有机会知道您对DOM进行了一些更改 . 并且DataTables无论如何都不能用于双向绑定，但本质上它本身就是一个DOM-“工厂”，它根据一组基础数据更新页面 .

    除此之外，您不应该插入原始HTML，而是以与初始化表格相同的格式插入数据 . 你怎么做我们不知道 . 如果您的表是DOM表，则可以将响应清理为值数组：

    var d = $(response, 'td').map(function(i, td) {
  return td.textContent
})
table.row("#user_row_3").data(d).invalidate().draw()
    回复于

相关问题