javascript - 第二页上缺少 jQuery row.child

Question

我使用 jQuery 创建了一个表。我添加了一个 row.child ，它将显示在每个父行之后。在第一页上，效果很好。但在第二页上却不见了。

function format(d) {
    return '' +

            '<i style=";color:#9b9b9b; font-size:10px; Padding-left:50px"> Vertragsart - ' + d[4] + '&nbsp; | &nbsp; Intensität - ' + d[5] + '</i>' +
            '';
}

var $j = jQuery.noConflict();

$j('document').ready(function () {
    var oTable = $j('#position_list').DataTable({
        "order": [[0, "desc"]],
        "iDisplayLength": 50,
        "oLanguage": {
            "sLengthMenu": "Zeige _MENU_ Einträge",
            "sSearch": "Suche:",
            "sInfo": "Zeige _START_ bis _END_ von _TOTAL_ Einträgen",
            "sInfoEmpty": "Zeige _START_ bis _END_ von _TOTAL_ Einträgen",
            "sInfoFiltered": "(gefiltert aus _MAX_ Datensätzen)",
            "oPaginate": {
                "sNext": "Nächste",
                "sPrevious": "Vorherige"
            },    
        },
    });

    $j('.parentrow').closest('tr').each(function () {    
        var row = oTable.row(this);
        var data = format(row);
        row.child(format(row.data())).show();   
    });
});

Answer 1

问题是您正在使用 jQuery 来选择行，但 jQuery 只能访问 DOM 上当前的行。正如评论中所说，在任何给定时刻，只有当前页面的行位于 DOM 中，因此这些是您的代码将操作的唯一行。

要在整个表中运行 jQuery 选择器，Datatables API 具有 $() method 。它接受一个 jQuery 选择器，该选择器将在表中的所有 tr 元素及其后代元素上运行，返回一个 jQuery 对象，例如 jQuery(selector) 是的。

因此您只需更改 oTable.$(...) 的 jQuery 选择器:

oTable.$('.parentrow').closest('tr').each(function () {    
    var row = oTable.row(this);
    var data = format(row);
    row.child(format(row.data())).show();   
});