jQuery使用DataTable实现删除数据后重新加载功能
更新时间：2017年02月27日 09:23:17 作者：Rexcnblog
利用jQuery Datatable和artTemplate组合来做的表格。但是当删除数据时，需要重新加载table里的数据。接下来通过本文给大家分享jQuery使用DataTable实现删除数据后重新加载功能，需要的朋友参考下
问题描述：
利用jQuery Datatable和artTemplate组合来做的表格。但是当删除数据时，需要重新加载table里的数据。但是问题是datatable并没有直接的重新渲染，反而给数据累加上了。
解决办法：
经过查看高人的blog，发现可以先销毁table，然后再重新渲染。
var dttable;
App.globalAjax("get", "/Order/MyJsonList", {}, function (result) {
var html = template('Orders-template', result);
$("#datatable1").find("tbody").html(html);
dt = $('#datatable1').dataTable({
"sPaginationType": "bs_full"
});
});
这个是第一次通过ajax获取到数据，然后利用artTemplate来渲染数据，最后填充到页面中，然后进行渲染。
接下来就是执行删除操作，然后重新加载渲染table
App.globalAjax("post", "/Order/DeleteOrder", data, function (result) {
App.globalAjax("get", "/Order/MyJsonList", {}, function (result) {
var html = template('Orders-template', result);
if ($('#datatable1').hasClass('dataTable')) {
dttable = $('#datatable1').dataTable();
dttable.fnClearTable(); //清空一下table
dttable.fnDestroy(); //还原初始化了的datatable
}
$("#datatable1").find("tbody").html(html);
$('#datatable1').dataTable();
});
});
到此，datatable就可以重新渲染了。
以上所述是小编给大家介绍的jQuery使用DataTable实现删除数据后重新加载功能，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持！
您可能感兴趣的文章:
相关文章
jQuery实现滑动页面固定顶部显示(可根据显示位置消失与替换)
这篇文章主要介绍了jQuery实现滑动页面固定顶部显示,还可根据显示位置消失与替换对应的当前显示项,具有一定参考借鉴价值,需要的朋友可以参考下2015-10-10
jQuery Autocomplete plugin 写的比较满意，拿出来分享，欢迎大家找BUG。2010-07-07
这篇文章主要介绍了 jquery如何取得元素标签名称，将html和js代码附上，具体操作步骤大家可查看下文的详细讲解，感兴趣的小伙伴们可以参考一下。2017-08-08
这篇文章主要为大家详细介绍了Jquery实现异步上传文件，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2022-07-07
这篇文章主要介绍了jQuery实现的网页换肤效果,结合完整实例形式分析了jQuery通过修改link标签的href属性值实现换肤效果的相关技巧,需要的朋友可以参考下2016-09-09
这篇文章主要为大家详细介绍了jQuery图片切换动画特效,具有一定的参考价值，感兴趣的小伙伴们可以参考一下2016-11-11
这篇文章主要介绍了解决jquery版本冲突的有效方法,对于web设计的兼容性调试很有借鉴价值,需要的朋友可以参考下2014-09-09
在IE7~IE8这种不支持HTML5的浏览器上，是利用Flash嵌入的方式实现的签名处理，在支持的HTML5的浏览器上默认采用canvas标签处理签名，可以生成 PNG格式、SVG格式的签名图片。非常适合在IPAD等移动客户端上实现手写签名的，该插件基于JQuery2015-05-05
这篇文章主要介绍了jquery+ajax实现跨域请求的方法,详细介绍了前台及后台的处理方法,是非常实用的技巧,需要的朋友可以参考下2015-01-01
这篇文章主要介绍了jQuery实现感应鼠标动画效果自动伸长的输入框,实例分析了jQuery鼠标事件及animate动画效果的使用技巧,具有一定参考借鉴价值,需要的朋友可以参考下2015-02-02
最新评论