JQuery DataTable删除行后的页面更新利用Ajax解决


Posted in Javascript onMay 17, 2013

使用Jquery的DataTable进行数据表处理非常方便,常遇到的一个问题就是删除一行后页面必须进行更新,需要注意的方法如下:前台页面中初始化table时注意:

var table = $('#sorting-advanced'); 
table.dataTable({ 
'bServerSide': true, 
'sAjaxSource': 'servlet/UserList<%=queryString%>', 
'bProcessing': true, 'bStateSave': true, 
'aoColumnDefs': [ 
{ 'bSortable': false, 'aTargets': [0,1,6]} 
], 
'sPaginationType': 'full_numbers', 
'sDom': '<"dataTables_header"lfr>t<"dataTables_footer"ip>', 
'fnInitComplete': function( oSettings ) 
{ 
// Style length select 
table.closest('.dataTables_wrapper').find('.dataTables_length select').addClass('select blue-gradient glossy').styleSelect(); 
tableStyled = true; 
} 
});

'bStateSave': true, 这个必须设置,这样就可以在删除返回时,保留在同一页上'bStateSave': true, 这个必须设置,这样就可以在删除返回时,保留在同一页上
删除的代码如下
function deleteConfirm(deleteID) 
{ 
$.modal.confirm('确实要删除此用户吗?', function() 
{ 
$.ajax('servlet/DeleteUser', { 
dataType : 'json', 
data: { 
userID: deleteID 
}, 
success: function(data) 
{ 
if (data.success =='true') 
{ 
$.modal.alert('删除成功!'); 
start = $("#sorting-advanced").dataTable().fnSettings()._iDisplayStart; 
total = $("#sorting-advanced").dataTable().fnSettings().fnRecordsDisplay(); 
window.location.reload(); 
if((total-start)==1){ 
if (start > 0) { 
$("#sorting-advanced").dataTable().fnPageChange( 'previous', true ); 
} 
} 
} 
else 
{ 
$.modal.alert('删除发生错误,请联系管理员!'); 
} 
}, 
error: function() 
{ 
$.modal.alert('服务器无响应,请联系管理员!'); 
} 
}); }, function() 
{ 
//$.modal.alert('Meh.'); 
}); 
};

其中只要是需要判断一下当前页中是否有数据,如果是最后一条的话,就在删除后调用
$("#sorting-advanced").dataTable().fnPageChange( 'previous', true );已回到上一页中
注意$("#sorting-advanced").dataTable().fnPageChange( 'previous'); 是不行的,必需进行刷新,否则页面中显示的iDisplayStart会从cookie中取得,还是删除前的iDisplayStart
Javascript 相关文章推荐
JQuery设置和去除disabled属性的5种方法总结
May 16 Javascript
javascript学习笔记(八)正则表达式
Oct 08 Javascript
jQuery Easyui使用(二)之可折叠面板动态加载无效果的解决方法
Aug 17 Javascript
在网页中插入百度地图的步骤详解
Dec 02 Javascript
浅析上传头像示例及其注意事项
Dec 14 Javascript
浅谈Angular路由守卫
Aug 26 Javascript
canvas+gif.js打造自己的数字雨头像的示例代码
Oct 26 Javascript
CentOS环境中MySQL修改root密码方法
Jan 07 Javascript
vue基础之data存储数据及v-for循环用法示例
Mar 08 Javascript
jquery实现垂直无限轮播的方法分析
Jul 16 jQuery
vue cli3 配置proxy代理无效的解决
Oct 30 Javascript
vue项目中使用rem,在入口文件添加内容操作
Nov 11 Javascript
extjs ColumnChart设置不同的颜色实现代码
May 17 #Javascript
JQuery设置和去除disabled属性的5种方法总结
May 16 #Javascript
javascript检测页面是否缩放的小例子
May 16 #Javascript
js获取键盘按键响应事件(兼容各浏览器)
May 16 #Javascript
js如何获取file控件的完整路径具体实现代码
May 15 #Javascript
Jquery+CSS3实现一款简洁大气带滑动效果的弹出层
May 15 #Javascript
jQuery bxCarousel实现图片滚动切换效果示例代码
May 15 #Javascript
You might like
PHP 全角转半角实现代码
2010/05/16 PHP
通过JavaScript或PHP检测Android设备的代码
2011/03/09 PHP
php 三大特点:封装,继承,多态
2017/02/19 PHP
原生JS实现Ajax通过POST方式与PHP进行交互的方法示例
2018/05/12 PHP
基于PHP+mysql实现新闻发布系统的开发
2020/08/06 PHP
PHP替换Word中变量并导出PDF图片的实现方法
2020/11/26 PHP
window.open不被拦截的实现代码
2012/08/22 Javascript
javascript中onclick(this)用法介绍
2013/04/19 Javascript
JQuery表格内容过滤的实现方法
2013/07/05 Javascript
Jquery跳到页面指定位置的方法
2014/05/12 Javascript
jQuery中outerHeight()方法用法实例
2015/01/19 Javascript
javascript history对象详解
2017/02/09 Javascript
JavaScript之json_动力节点Java学院整理
2017/06/29 Javascript
微信小程序中button组件的边框设置的实例详解
2017/09/27 Javascript
Vue组件通信的几种实现方法
2019/04/25 Javascript
vue用BMap百度地图实现即时搜索功能
2019/09/26 Javascript
vue实现在线翻译功能
2019/09/27 Javascript
js实现数字从零慢慢增加到指定数字示例
2019/11/07 Javascript
[43:49]LGD vs CHAOS 2019国际邀请赛小组赛 BO2 第一场 8.15
2019/08/16 DOTA
Python利用matplotlib.pyplot绘图时如何设置坐标轴刻度
2018/04/09 Python
Django1.9 加载通过ImageField上传的图片方法
2018/05/25 Python
用python生成(动态彩色)二维码的方法(使用myqr库实现)
2019/06/24 Python
python实现文件批量编码转换及注意事项
2019/10/14 Python
Python 简单计算要求形状面积的实例
2020/01/18 Python
Python3使用xlrd、xlwt处理Excel方法数据
2020/02/28 Python
Pycharm插件(Grep Console)自定义规则输出颜色日志的方法
2020/05/27 Python
FitFlop澳大利亚官网:英国符合人体工学的鞋类品牌
2017/06/05 全球购物
节省高达65%的城市景点费用:Go City
2019/07/06 全球购物
办公室前台岗位职责
2014/01/04 职场文书
邮政员工辞职信
2014/01/16 职场文书
博士毕业生自我鉴定范文
2014/04/13 职场文书
志愿者活动总结
2014/04/28 职场文书
党员批评与自我批评发言
2014/10/02 职场文书
员工保密协议范本,您一定得收藏!很有用!
2019/08/08 职场文书
Vue Element-ui表单校验规则实现
2021/07/09 Vue.js
聊聊基于pytorch实现Resnet对本地数据集的训练问题
2022/03/25 Python