Question

我正在使用DataTables jQuery插件来显示HTML表格，并且我已经创建了一个AJAX行删除函数，该函数在后台发送删除POST请求并显示返回的{ {1}} div中的{1}}消息，并使用jQuery HTML函数从#info中删除相关的HTML行。

这是从行的删除按钮调用DOM的函数：

remove()

到目前为止一切正常，行被删除并显示返回消息，但是，当我单击标题再次对行进行排序（升序或降序）时，已删除的行重新出现（在当前会话中，而不是在页面之后）重装）它仍然是可搜索的，我希望解决这个问题。

从我读过的，问题是DataTables只加载一次表，但有一些方法可以从每个deleteData($id)加载它。我已尝试过许多不同的方法来做到这一点，但它不起作用。

Answer 1

我之前从未使用过DataTable，但是在阅读你的问题时我很想学习一点。

然后我注意到你只是在给定行上使用jQuery .remove()删除了行（换句话说，删除了真正暴露的DOM行），而this DataTable page表示你应该使用专用.row().remove()。

因此，在您的示例中，我猜您应该将$('#row' + setID).remove();替换为yourDataTable.row($('#row' + setID)).remove();。

EDIT。
感谢@Bryan Ramsey的评论，我刚才意识到我建议的解决方案不完整：

OP $('#row' + setID).remove(); 使用的语句仅删除DOM 中的行，但将其保留在DataTable对象中，以便再次显示
然后我建议使用yourDataTable.row($('#row' + setID)).remove();，它确实从DataTable对象中删除了行，但现在将它保存在DOM 中，因此它在视觉上不会消失下一次改变发生了！
所以真正完整的解决方案是yourDataTable.row($('#row' + setID)).remove().draw();，其中draw()可确保该行立即消失。

注意:(如果您正在获取.row不是函数或未定义$ datatable）您必须在删除行之前重新初始化数据表

var $datatable = $('#datatable-selector').DataTable();
$datatable.row($deletingRowSelector).remove().draw();

Answer 2

你需要从它自己的APi中删除它当这个'table'被调用时：

var table = $('#yourDatatableId').DataTable();

然后：

...done
    (
        function(data)
        {
            //No need for these:
            //$('#info').html(data);    
            //var setID = id;

            table.row( $(this).parents('tr') ).remove().draw();    
        }
    );

排序后再次添加已删除的DataTable行

2 个答案: