将数据属性放在DataTables 1.10上的行add中

Gid*_*eon 8 html javascript jquery jquery-datatables datatables-1.10

table.row.add()使用此代码使用方法在DataTables 1.10.2上动态添加新行:

table.row.add([
    '',
    name,
    target_l,
    details,
    panel.html()    
]).draw();
Run Code Online (Sandbox Code Playgroud)

我制作了这个加价:

<tr role="row" class="odd">
    <th>1 .</th>
    <td class="sorting_1">ID Fee</td>
    <td>All students</td>
    <td></td>
    <td>
        <button class="btn btn-null btn-xs" onclick="_remove(59, 'ID Fee')">
            <span class="fui-cross"></span>
        </button>
        <button class="btn btn-null btn-xs" onclick="_edit(59, 'ID Fee', '', '')">
            <span class="icon-pencil"></span>
        </button>
    </td>
</tr>
Run Code Online (Sandbox Code Playgroud)

我想要做的是将data-id(和其他数据)属性添加到新添加的tr标签(在插入行中或之后),并使其像这样:

<tr data-id="59" role="row" class="odd">
Run Code Online (Sandbox Code Playgroud)

我已经设法使用代码获取新添加的行的索引,并返回最后一行索引:

var i = table.row.add([
    '',
    name,
    target_l,
    details,
    panel.html()    
]).index();
Run Code Online (Sandbox Code Playgroud)

并尝试执行以下操作以使用索引添加data-id属性:

var id = $("#department_id").val();
table.row(i).attr("data-id", id);
// table.row(i).data("id", id);
// I wanted to try this but there is also a method called data() already in
// DataTables so it will not work like in JQuery.
Run Code Online (Sandbox Code Playgroud)

我是DataTables的新手,已经滚动了它的源代码,红色的评论.虽然不善于理解其开头的功能_fn*().如果没有任何其他方式而不依赖这些_fn*()功能,谢谢!

Gyr*_*com 9

您可以使用rows().nodes() API函数,如下所示:

var i = table.row.add([
    '',
    name,
    target_l,
    details,
    panel.html()    
]).index();

var id = $("#department_id").val();
table.rows(i).nodes().to$().attr("data-id", id);
Run Code Online (Sandbox Code Playgroud)

  • .to $()将节点转换为jQuery元素. (2认同)