jQuery使用DataTable实现删除数据后重新加载功能_网络技术

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

发布时间 - 2026-01-10 23:17:36 点击率：次

问题描述：

利用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 # 重新加载 # datatable # jquery dataTable 后台加载数据并分页实例代码 # jQuery获取Table某列的值（推荐） # bootstrap jquery dataTable 异步ajax刷新表格数据的实现方法 # select下拉框插件jquery.editable-select详解 # jQuery实现动态添加tr到table的方法 # jquery获取table指定行和列的数据方法(当前选中行、列) # 使用jquery给指定的table动态添加一行、删除一行 # jQuery 获取遍历获取table中每一个tr中的第一个td的方法 # jQuery EasyUI Tab 选项卡问题小结 # jquery+css实现Tab栏切换的代码实例 # 加载 # 小编 # 在此 # 上了 # 给大家 # 问题是 # 来做 # 到此 # 解决办法 # 所述 # 给我留言 # 感谢大家 # 清空 # 就可以 # 再重新 # 疑问请 # 有任何 # dttable # blog # brush

相关栏目：【网站优化151355 】【网络推广146373 】【网络技术251813 】【 AI营销90571 】

上一篇：解决TP5.1出现A non well formed num

下一篇：伪网站建站：如何低成本实现高流量转化？

相关栏目网站优化
网络推广
网络技术
AI营销

最新文章 Sublime怎么一键压缩JS代码 Su sublime如何在搜索中使用正则表达式 Sublime如何设置透明窗口效果 Su mysql如何设计商品表结构_mysql css属性背景图不显示怎么办_通过检查路如何使用Golang实现排序_Golan 农历闰月是怎么回事_为合回归年加一月调整塑造《刺客信条》艾吉奥传奇的编剧离开育碧 1英里等于多少公里 1mile和km的换 css grid布局中行和列是如何定义的 PS批量旋转和翻转图片，快速校正图片方向 C# Swagger UI自定义方法 C OPPO手机九宫格和全键盘怎么切换_OP Go语言如何实现用户登录注册_Golan 1节飞行速度多少公里每小时 1节是多少公纸嫁衣8千子树第五章庙门怎么开启庙门 Laravel 多行数据编辑表单中实现逐明日之后如何提升钓鱼等级明日之后提升钓支付宝怎样查年度账单_支付宝年度账单查看 C# 多线程UI更新Dispatcher

上一篇：解决TP5.1出现A non well formed num

下一篇：伪网站建站：如何低成本实现高流量转化？