1.执行操作后刷新表格,停留在当前页面
1.1 场景
删除(操作)某一页的数据后,希望刷新数据并停留在当前页上,结果却回到了第一页。
1.2 解决方法
function delete(id){
//删除操作
......
//draw()重绘表格.false不是指不重绘,而是重绘当前页的表格;没有false会做一个完全的重绘,并且回到第一页.
$("#businessTable").dataTable().draw(false);
}
1.3 参考文档
[1] http://datatables.club/reference/api/draw().html
[2] https://blog.csdn.net/littleqiang520/article/details/52800001
2.状态保存
2.1 场景
从当前页面跳转到详情页,从详情页返回时跳转到之前所在的页面,而不是第一页。
2.2 解决方法
$(function () {
//初始化表格
window.groupTable = $("#businessTable").dataTable({
......
bStateSave: true, //保存表格状态。当用户重新刷新页面,表格的状态将会被设置为之前的设置。
......
}).api();
});
2.3 参考文档
[1] http://datatables.club/reference/option/stateSave.html
3.不需要保存状态的页面跳转
3.1 场景
使用bStateSave后,从其他页面跳转回到某个页面时,一直显示为之前的状态。期望清除该表格页面的状态,显示第一页,而不是在之前的状态。
3.2 解决方法
3.2.1 consumerList.html(应用列表)
$(function () {
//初始化表格
window.consumerTable = $("#businessTable").dataTable({
......
bStateSave: true,
......
}).api();
//检查consumerStateSave
var isFirst = sessionStorage.getItem("consumerStateSave");
if (isFirst != 1) {
consumerTable.state.clear();
consumerTable.ajax.reload();
}
sessionStorage.setItem("consumerStateSave", 0); //重置
});
3.2.2 consumerDetails.html(详情页)
$(function () {
sessionStorage.setItem("consumerStateSave", 1);
......
});
3.2.3 其他页面
从其他页面跳转到consumerList.html时,期望显示第一页,所以不对consumerStateSave进行操作。跳转到consumerList.html,consumerStateSave为0,执行clear()和reload()。
3.3 参考文档
[1] https://jingyan.baidu.com/article/3c48dd34d38edde10be35825.html
[2] https://blog.csdn.net/z5976749/article/details/50474949
[3] http://datatables.club/reference/api/state.clear().html