我使用的数据表 jQuery插件来显示一个HTML表,我已作出AJAX
发送所述删除行删除功能POST
在后台请求并显示返回的HTML
在消息#info
的div和删除相关的HTML
从行DOM
使用jQuery remove()
功能.
这是deleteData($id)
从行的删除按钮调用的函数:
function deleteData(id) { var data = "id="+id; $.ajax( { type: "POST", url: "delete.php", data: data } ).done ( function(data) { $('#info').html(data); var setID = id; $('#row' + setID).remove(); } ); }
一切工作很好,到目前为止,该行被删除,显示返回消息,然而,当我点击标题行再次(递增或递减),删除的行再次出现(在当前会话中,而不是之后重新加载页面)进行排序,并它仍然是可搜索的,我希望解决这个问题.
从我读过的,问题是DataTables只加载一次表,但是有一些方法可以从DOM
每种类型加载它.我已尝试过许多不同的方法来做到这一点,但它不起作用.
我以前从未使用过DataTable,但是读了你的问题我很想学习一点.
然后我注意到你只是.remove()
在给定的行上使用jQuery删除行(换句话说,删除真正公开的DOM行),而这个DataTable页面声明你应该使用专用.row().remove()
.
所以在你的例子中我猜你应该替换$('#row' + setID).remove();
为yourDataTable.row($('#row' + setID)).remove();
.
编辑.
感谢@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();