数据表：删除行而不影响“（从 X 总条目中过滤）”答案

【问题标题】：Datatables: Remove row without affecting "(filtered from X total entries)"数据表：删除行而不影响“（从 X 总条目中过滤）”
【发布时间】：2017-03-22 11:35:39
【问题描述】：

我有一个相当大的表，当通过 Datatables API 运行时，它需要几秒钟来呈现。

在渲染时，我将所有行的不透明度设置为 0，并在开头增加一行包含“正在渲染表...”的注释，因此在准备好之前显示的抖动和丑陋的表更少见过。

然后使用 initComplete 回调函数删除该行并使其他行可见：

"initComplete": function(){
    $( 'table.MIS_return_data tbody.MIS_returned_content tr.render-note' ).remove();
    $( 'table.MIS_return_data tbody.MIS_returned_content tr:not(.no-select)' ).css('opacity', 1);
    $( 'table.MIS_return_data tbody.MIS_returned_content tr.no-select' ).css('opacity', 0.6);
},

问题是在表格底部我得到一个注释：

显示 580 个条目中的 1 到 580 个（从 581 个总条目中过滤）

它已过滤的 1 个条目是带有渲染注释的行。

我需要完全删除该行，并且 API 不再“看到”该行。我该怎么做？

我也尝试过使用以下内容而不是 jQuery.remove()：

"initComplete": function(){
    table.rows( $( 'table.MIS_return_data tbody.MIS_returned_content tr.render-note' ) ).remove();
    table.draw();
    $( 'table.MIS_return_data tbody.MIS_returned_content tr:not(.no-select)' ).css('opacity', 1);
    $( 'table.MIS_return_data tbody.MIS_returned_content tr.no-select' ).css('opacity', 0.6);
},

但这不仅不起作用，而且它还只将不透明度应用于表中的第一行。

一种解决方法是完全删除底部的注释：

"language": {
    "infoFiltered": "",
},

但是，这并不理想，因为我希望用户能够过滤结果，通过某些参数隐藏/显示行。因此，该笔记将具有实际用途。

如果您需要有关所写内容的更多详细信息或说明，请询问。

感谢任何帮助！谢谢

【问题讨论】：

你能改用blockUI之类的东西吗？您还可以在构建表格时隐藏表格本身，或者使用服务器端来获取您需要显示的内容。
你试过 row().remove() 吗？
您可以在jsfiddle.net 上创建一个示例来演示您的问题吗？总的来说，我建议使用 DataTables API 来操作行，例如 row().remove()。另请注意，$() 仅影响第一页上的行。
@annoyingmouse 谢谢！就像把笔记放在桌子外面一样简单。哇！

标签： javascript jquery datatables

【解决方案1】：

就像上面说的@annoyingmouse..

在表格上注入一个代表表格的“块”......一旦 javascript 完成表格的构建......隐藏块并使用粗略的隐藏/显示或在父级上使用 CSS 淡化过渡来显示表格.这样可以更好地分离关注点……数据表使用正确的数据来完成它的工作，用户界面通过在正确的时间显示和隐藏来完成它的工作。

这与linkedin 和facebook 等其他网站使用的策略相同。在初始加载时，页面呈现一个静态块（例如在 fb 墙上，这个块看起来像一个淡出的墙帖）......然后一旦 xhr 请求返回数据，前端应用程序就会用实际内容替换静态块。

在您的情况下，它是相同的，但不是等待 xhr 解决，而是由数据表渲染回调触发。

【讨论】：