从表值向 Datatable 添加新行？答案

【问题标题】：Add new row to Datatable from table values?从表值向 Datatable 添加新行？
【发布时间】：2013-11-02 08:11:13
【问题描述】：

我有一个包含信息的数据表，以及一个包含完整文本输入表的字段集。用户应该能够根据信息值添加新行，但这些行未正确添加。显然 tr 正在被克隆和添加（在需要的地方清空），相应的值正在附加，但数据表的分页没有更新。我无法弄清楚如何正确使用 .fnAddData() 来完成这里的工作。最重要的是，我不知道如何处理“权限”列 - 获取复选框以转换为表格的文本。有任何想法吗？提前致谢。

http://jsfiddle.net/BWCBX/28/

jQuery

$('#addRow').click(function () {
    var tbody = $('#example tbody');
    var tr = tbody.find('tr:first').clone();
    tr.find('td:first').text($(".engine").val());
    tr.find('td:eq(1)').empty();
    tr.find('td:eq(2)').empty();
    tr.find('td:eq(3)').text($(".version").val());
    tr.find('td:eq(4)').empty();
    tr.appendTo(tbody);
});

【问题讨论】：

标签： javascript jquery append datatables clone

【解决方案1】：

API docs 中有很好的例子说明如何使用fnAddData。

我已根据文档中提供的示例重写了您的 JS。我已将复选框提取到单独的函数中以保持高可读性。更新的小提琴是here。

【讨论】：

谢谢，这很好用。我编辑了上面的困境以使用复选框。你知道如何对付这头野兽吗？
只需将值添加到复选框，就像您对文本输入所做的那样。
对，但我需要仅在选中文本时才显示文本。 jsfiddle.net/BWCBX/29
您可以使用 jQuery :checked 选择器，请参阅我的更新答案。
Rybak，我将如何在引擎值旁边添加一个图标？不仅仅是 $(".engine").val() 还要添加 .html()。