• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • JavaScript
  • ASP.NET
  • PHP
  • 正则表达式
  • AJAX
  • JSP
  • ASP
  • Flex
  • XML
  • 编程技巧
  • Android
  • swift
  • C#教程
  • vb
  • vb.net
  • C语言
  • Java
  • Delphi
  • 易语言
  • vc/mfc
  • 嵌入式开发
  • 游戏开发
  • ios
  • 编程问答
  • 汇编语言
  • 微信小程序
  • 数据结构
  • OpenGL
  • 架构设计
  • qt
  • 微信公众号
您的位置:首页 > 程序设计 >JavaScript > jQuery使用DataTable实现删除数据后重新加载功能

jQuery使用DataTable实现删除数据后重新加载功能

作者:Rexcnblog 字体:[增加 减小] 来源:互联网 时间:2017-05-11

Rexcnblog通过本文主要向大家介绍了jquery datatable,jquery中datatable,jquery datatable api,jquery datatable分页,jquery datatable排序等相关知识,希望对您有所帮助,也希望大家支持linkedu.com www.linkedu.com

问题描述:

利用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"
  });
});
</div>

这个是第一次通过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();
      });
    });
</div>

到此,datatable就可以重新渲染了。

以上所述是小编给大家介绍的jQuery使用DataTable实现删除数据后重新加载功能,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对网站的支持!

</div>
分享到:QQ空间新浪微博腾讯微博微信百度贴吧QQ好友复制网址打印

您可能想查找下面的文章:

  • jquery dataTable 获取某行数据
  • 使用jquery datatable和bootsrap创建表格实例代码
  • jQuery使用DataTable实现删除数据后重新加载功能
  • bootstrap jquery dataTable 异步ajax刷新表格数据的实现方法
  • jQuery中Datatables增加跳转到指定页功能
  • 利用JQuery实现datatables插件的增加和删除行功能

相关文章

  • 2017-05-11Javascript同时声明一连串(多个)变量的方法
  • 2017-05-11图解Javascript——作用域、作用域链、闭包
  • 2017-05-11SyntaxHighlighter自动识别并加载脚本语言 原创
  • 2017-06-03复制网页内容后自动添加版权文字的方法(兼容IE、Firefox和Chrome)
  • 2017-05-11详解Node.js实现301、302重定向服务
  • 2017-05-11jquery实现拖动效果(代码分享)
  • 2017-05-11微信小程序微信支付接入开发实例详解
  • 2017-05-11在 Angular 中实现搜索关键字高亮示例
  • 2017-05-11BOM之navigator对象和用户代理检测
  • 2017-05-11jQuery点击头像上传并预览图片

文章分类

  • JavaScript
  • ASP.NET
  • PHP
  • 正则表达式
  • AJAX
  • JSP
  • ASP
  • Flex
  • XML
  • 编程技巧
  • Android
  • swift
  • C#教程
  • vb
  • vb.net
  • C语言
  • Java
  • Delphi
  • 易语言
  • vc/mfc
  • 嵌入式开发
  • 游戏开发
  • ios
  • 编程问答
  • 汇编语言
  • 微信小程序
  • 数据结构
  • OpenGL
  • 架构设计
  • qt
  • 微信公众号

最近更新的内容

    • js禁用控件回车事件监听事件
    • localStorage的黑科技-js和css缓存机制
    • javascript内存分配原理实例分析
    • 在 Angular2 中实现自定义校验指令(确认密码)的方法
    • Ajax验证用户名或昵称是否已被注册
    • jQuery给表格添加分页效果
    • 从零开始做一个pagination分页组件
    • Easyui Tree获取当前选择节点的所有顶级父节点
    • bootstrap——bootstrapTable实现隐藏列的示例
    • js 数据存储和DOM编程

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有