如何销毁数据表
Posted
技术标签:
【中文标题】如何销毁数据表【英文标题】:How can I destroy a datatable 【发布时间】:2015-04-29 13:54:02 【问题描述】:我有数据表,表有 ID 示例。
现在我需要销毁数据表并写:
$('#example').dataTable().fnDestroy();
但我明白了:
未捕获的类型错误:无法读取未定义的属性“样式”
这也是我在控制台日志中得到的:
这里有什么问题?为什么我不能销毁数据表?如何解决?
【问题讨论】:
你可能想要$('#example').DataTable().fnDestroy();
- 注意大写D
。使用dataTable
(带有d
)返回一个jQuery对象。
是的,但现在我得到:Uncaught TypeError: undefined is not a function
所以大写的“D”在这里不是问题
你能不能 console.log $('#example').dataTable()
看看它是否是我们所期望的
"有没有办法销毁表",是的 - 你做对了 - 请参阅这个 1.9.x 示例 -> jsfiddle.net/fdfm04gL <instance>.fnDestroy(),
、$('#example').DataTable().fnDestroy()
或 $('#example').dataTable().fnDestroy()
- 这三种方法都适用于 1.9.x。所以你的问题依赖于其他地方,你能在小提琴中重现错误吗?我猜你在 fnDestroy()
之前以某种方式操纵了注入的 DOM
【参考方案1】:
对于最新版本的数据表,请使用:
$('#example').DataTable().destroy();
更多信息请参考:https://datatables.net/reference/api/destroy%28%29
对于旧版本,请按照 Hobo Sapiens 的说明使用:
$('#example').DataTable().fnDestroy();
【讨论】:
如果你得到“但现在我得到:Uncaught TypeError: undefined is not a function”,那么你可能会导入 jquery 两次。 不,$('#example').DataTable().fnDestroy()
和 $('#example').dataTable().fnDestroy()
都适用于 1.9.x
我在使用 .destroy(); 时遇到同样的错误; :未捕获的类型错误:无法读取未定义的属性“样式”
@davidkonrad,先生,如果我在模态中使用它会怎样?我的模态中有一个表格,然后使用 ajax 调用数据..
@d_unknown,问问题,我回答【参考方案2】:
这是 v1.10 最终对我有用的内容。
// Define a variable for your dataTable object to use
var reportListDataTable = null;
// Then inside a function/method somewhere...
// Destroy the dataTable and empty because the columns may change!
if (reportListDataTable !== null )
// for this version use fnDestroy() instead of destroy()
reportListDataTable.fnDestroy();
reportListDataTable = null;
// empty in case the columns change
$('#reportListTableId').empty();
// Build dataTable with ajax, columns, etc.
reportListDataTable = $('#reportListTableId').dataTable(
//... Your dataTables code here
);
【讨论】:
即使使用 v1.10,它仍然取决于您使用的是 dataTable() 还是 DataTable()。注意“大写 D”。【参考方案3】:对我有用的是在单击插入按钮时破坏数据表,而不是在获取数据按钮上。所以破坏 dataTable 的按钮不是重新创建表。从其他按钮单击调用的其他一些函数会创建数据表。 代码很简单:
破坏数据表的按钮:
var otable = $('#claimRecordTable').dataTable();
if (otable != null) otable.fnDestroy();
创建数据表的按钮:
$('#claimRecordTable').dataTable();
【讨论】:
以上是关于如何销毁数据表的主要内容,如果未能解决你的问题,请参考以下文章