数据表在单元格更新后重新调整列宽

Question

在我的datatables 表中，在我用长字符串更新单元格后，我无法更新列宽。

---

我从这个开始（一切都很好）：

---

但是当我更新包含大量文本的表格单元格时，标题列宽不会更新：

---

这是我用来初始化表格的代码：

    var table = $('#example').DataTable({
        paging: true,
        scrollX: true,
        search: {'smart': false},
        columnDefs: [
            {className: 'last_column_td', targets: [last_col_id]}  // add class to cells of last col for easy selection
        ],
        iDisplayLength: 10,
        lengthMenu: [[10, -1], [10, "All"]],
        dom: 'Blfrtip',
        buttons: ['copy', 'csv', 'excel']
    });

注意：datatables 在参数scrollX 设置为true 时创建两个 表（一个表用于标题，一个表用于实际数据/单元格）。

internet says 我需要在更新单元格内容后调用table.columns.adjust().draw()，以便表格自行调整，但这对我不起作用。

知道将单元格内容更改为长字符串后如何更新列宽吗？

Answer 1

原来我使用了不正确的方法来更新表格中的单元格，导致单元格值的更新“无法识别”。

我正在使用 Jquery 的 .html() 函数更新单元格的 innerHTML 属性。但正如 datatables 网站上所述，初始化表不会“识别”对单元格内部 HTML 的更改作为对单元格 value 的更改，因此会出现功能（例如问题中的问题） ，而draw() 等函数将无法识别对值的更新。简而言之，在页面上的可见表与包含在已初始化（原始）表中的实际表值之间创建了断开连接。

要正确更新表格单元格，应首先使用数据表的cell() 或cells() 方法选择单元格，然后使用draw() 方法使用更改后的值更新可见表格。