javascript - dataTable问题，求教
本文介绍了javascript - dataTable问题，求教的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
问 题
初始化时，展示所有项（数据是写死的dataOrigin）
输入查询条件查询后，重新设置dataOrigin，绘制表格，求教怎么绘制
现在的状况是初始化可以执行，但如果要执行搜索的话一定要注释掉初始化的代码，否则会报错
求教大神
<body>
<input type="text" name="" id="txt" placeholder="输入姓名搜索"/>
<input type="button" value="查找" id="btn"/>
<table id="table">
<thead>
<th>姓名</th>
<th>性别</th>
<th>年龄</th>
</thead>
</table>
<script>
var dataOrigin=[
{"name":"mike","gender":"male","age":"20"},
{"name":"lisa","gender":"female","age":"24"}
];
$(function(){
var t=$("#table").DataTable({
"data":dataOrigin,
"columns":[
{"data":"name"},
{"data":"gender"},
{"data":"age"}
],
"paging":false,
"searching":false,
"info":false
});
$("#btn").click(function(){
// 重新设置dataOrigin=var dataOrigin=[
// {"name":"lisa","gender":"female","age":"24"}
// ]
// 并绘制表格，求教怎么弄法
var dataOrigin=[
{"name":"lisa","gender":"female","age":"24"}
];
$("#table").DataTable({
"data":dataOrigin,
"columns":[
{"data":"name"},
{"data":"gender"},
{"data":"age"}
],
"paging":false,
"searching":false,
"info":false
});
})
})
</script>
</body>
解决方案
//只用构造一次datatable
var table = $('#example').DataTable();如果要对数据更改
table.clear(); //清除现有
for (var i .....)
table.row.add({
数据
.....
});
table.draw(); //重绘表格其实如果你的数据都来源于一个完整的表，筛选之后，
你可以用隐藏行来做到，API：https://datatables.net/refere...。
这篇关于javascript - dataTable问题，求教的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
