Question

我有一个HTML表，我在其中应用了DataTables函数。我使用表格的第一行和模板＆＃39;应用为我的模板行。然后选择此格式并使用JSON提要填充表中的所有行。问题是DataTables提供的分页包含这个隐藏的模板行，所以总是使我的第一页显示的行少于其他所有行。

有没有办法用类＆＃39;模板＆＃39;排除任何行（其中只有一行）。适用于tr？

<!-- DataTables CSS -->
<link href="/bower_components/datatables-plugins/integration/bootstrap/3/dataTables.bootstrap.css" rel="stylesheet">

<!-- DataTables Responsive CSS -->
<link href="/bower_components/datatables-responsive/css/dataTables.responsive.css" rel="stylesheet">

<div class="alert-message"></div>

<div class="dataTable_wrapper">

    <table class="loadtable table table-hover table-stripped" id="problem_table" data-page="0" data-params="" data-orderby="p.name" data-orderdir="DESC" data-url="/admin/problem/ajax/tables/problem" cellpadding="0" cellspacing="0" border="0">
        <thead>
            <tr>
                <th class="orderable asc">Name</th>
                <th class="orderable no-sort" width="10%">Helpful?</th>
                <th class="orderable" width="15%">Created</th>
                <th class="orderable c" width="10%">Live?</th>
                <th class="r no-sort" width="12%">Actions</th>
            </tr>
        </thead>
        <tbody>
            <tr id="problem_#PROBLEMID#" class="template #ROWCLASS#">
                <td class="orderable asc">#NAME#</td>
                <td class="orderable"><span class="fa fa-thumbs-o-up"> #UP_VOTE#</span> <span class="fa fa-thumbs-o-down"> #DOWN_VOTE#</span></td>
                <td class="orderable">#CREATED#</td>
                <td class="orderable c"><span class="fa #IS_LIVE#"></span></td>
                <td class="r last">#ACTIONS#</td>
            </tr>
         </tbody>
    </table>
</div>

$(document).ready(function() {

    delay( function() {
        $('#problem_table').DataTable({
            responsive: true,
            pageLength: 20,
            aLengthMenu: [[20, 40, 60, -1], [20, 40, 60, "All"]],
            aoColumnDefs : [{ "bSortable" : false, "aTargets" : [ "no-sort"     ] }]
        });
    }, 200 );

});

Answer 1

您可以使用旧的custum row filter：

$.fn.dataTableExt.afnFiltering.push(
    function( oSettings, aData, iDataIndex ) {
        var row = oSettings.aoData[iDataIndex].nTr;
        return $(row).hasClass('template') ? false : true;
    }
);

即使它是1.10.x之前的匈牙利表示法，它仍适用于DataTable()个实例。

演示 - ＆gt;的 http://jsfiddle.net/zaxkrc49/

Jquery DataTables用于排除具有特定类的行

1 个答案: