jquery-datatables 销毁重新渲染

55次阅读

共计 600 个字符,预计需要花费 2 分钟才能阅读完成。

为什么要销毁重新渲染?

解决表格数据更换后数据不更新问题
解决列名更换后 tbody 中列的错位问题

渲染表格对象
<body>
<div id=”tableBox”>
<table class=”dataTable table table-bordered ” cellspacing=”0″ cellpadding=”0″></table>
</div>
</body>

<script>
var Table = null;
var option={
data:data,
columns:columns,

}
Table = $(“#tableBox table”).DataTable(option)
</script>

怎么样销毁表格对象?
这里存在一个误区:认为生成的只有一个存在变量中表格对象,将其销毁后就可以了。其实 datatable 生成的表格对象是有两部分构成:一为数据对象; 二为 Dom 对象
<script>

// 删除表格对象
if(Table){
Table.destroy();
Table.clear();
Table=null;
// 删除 dom 中的标签片段
$(“#table”).html(“”)
// 重新加入 table 标签
$(“#table”).append(“<table class=”dataTable table table-bordered ” cellspacing=”0″ cellpadding=”0″></table>”);

}

</script>

正文完
 0