在项目中,页面初始化的时候,通过通过向后台请求数据,页面初始化完之后,datatable是有数据的,当我点击页面的搜索按钮(按照时间过滤数据),datatable的数据要能重新刷新或者重载;这一点,我的实现是直接从数据库中查询,目前的数据量比较小,还没必要用到缓存,此时,由于初做web,遇到了好多问题,诸如datatable cannot initial 等等问题, 
datatable初始化的代码:

  1. $(document).ready(function() {
  2. $('#example1').DataTable({
  3. "bPaginage": false,
  4. "sPaginationType": "full_numbers",
  5. "oLanguage": {
  6. "sLengthMenu": "每页显示 _MENU_ 条",
  7. "sZeroRecords": "没有找到符合条件的数据",
  8. "sInfo": "当前第 _START_ - _END_ 条 共计 _TOTAL_ 条",
  9. "sInfoEmpty": "没有记录",
  10. "sInfoFiltered": "(从 _MAX_ 条记录中过滤)",
  11. "sSearch": "搜索",
  12. "sProcessing": "数据加载中...",
  13. "oPaginate": {
  14. "sFirst": "首页",
  15. "sPrevious": "上一页",
  16. "sNext": "下一页",
  17. "sLast": "尾页"
  18. }
  19. },
  20. "aoColumns": [
  21. {
  22. "sDefaultContent": "",
  23. fnRender: function (obj) {
  24. return "<input type='checkbox' name='checkbox1'/>"
  25. }
  26. },
  27. {"mData": "column_name"},
  28. {"mData": "data_type"},
  29. {"mData": "column_comment"}
  30. ]
  31. });
  32. $('#example2').DataTable({
  33. "bProcessing":false,
  34. "bFilter" : true,
  35. "bPaginate": true,
  36. "sPaginationType": "full_numbers",
  37. "bSort": true,
  38. "oLanguage": {
  39. "sLengthMenu": "每页显示 _MENU_ 条",
  40. "sZeroRecords": "没有找到符合条件的数据",
  41. "sInfo": "当前第 _START_ - _END_ 条 共计 _TOTAL_ 条",
  42. "sInfoEmpty": "没有记录",
  43. "sInfoFiltered": "(从 _MAX_ 条记录中过滤)",
  44. "sSearch": "搜索",
  45. "sProcessing": "数据加载中...",
  46. "oPaginate": {
  47. "sFirst": "首页",
  48. "sPrevious": "上一页",
  49. "sNext": "下一页",
  50. "sLast": "尾页"
  51. }
  52. },
  53. "aoColumns": [
  54. {"mData": "column_name"},
  55. {
  56. "sDefaultContent": "",
  57. fnRender: function (obj) {
  58. return "<input type='checkbox' name='checkbox2'/>"
  59. }
  60. },
  61. {
  62. "sDefaultContent": "",
  63. fnRender: function (obj) {
  64. return "<button class='btn' " +
  65. "style='margin-top: -2px;margin-bottom: -18px;padding-top: 3px;height: 24px!important;" +
  66. "font-size: 8px;color: snow' " +
  67. "onclick=dl(this)>删除</button>"
  68. }
  69. }
  70. ]
  71. });
  72. });
  73. var table2 = $('#example2').dataTable();
  74. oSettings = table2.fnSettings();
  75. $.getJSON("transform.action?data="+data.join(","), null, function( json )
  76. {
  77. for (var i=0; i<json.aaData.length; i++)
  78. {
  79. table2.oApi._fnAddData(oSettings, json.aaData[i]);
  80. }
  81. oSettings.aiDisplay = oSettings.aiDisplayMaster.slice();
  82. table2.fnDraw();
  83. });
  84. //也许你还可能用到这几个方法:
  85. table = $('#e
  86. xample1').dataTable();
  87. oSettings = table.fnSettings();
  88. table.fnClearTable(this);

一个简单的方法… 
$(‘YourDataTableID’).dataTable()._fnAjaxUpdate(); 
它将通过与非常简单的ajax请求刷新数据。

bootstrap datatable 数据刷新问题的更多相关文章

  1. bootstrap修改数据刷新页面跳转到当前页的问题

    修改按钮的页面的方法里添加如下代码 1      var pn = $("#datatable").bootstrapTable('getOptions').pageNumber; ...

  2. 利用表格分页显示数据的js组件bootstrap datatable的使用

    前面展示了datatable的简单使用,还可以通过bootstrap结合datatable来使用,这样可以进一步美化datatable插件 <!DOCTYPE html> <html ...

  3. asp.netajax与jquery和bootstrap的无刷新完美实现

    20190421asp.netajax与jquery和bootstrap的无刷新完美实现 设计代码和后台代码中重要部分加粗和深色以及字号加大. 设计前台代码: <%@ Page Title=&q ...

  4. bootstrap datatable项目封装

    (function($) {     $.fn.formJSON = function() {         var serializeObj = {};         var array = t ...

  5. excel to datatable (c#用NPOI将excel文件内容读取到datatable数据表中)

    将excel文件内容读取到datatable数据表中,支持97-2003和2007两种版本的excel 1.第一种是根据excel文件路径读取excel并返回datatable /// <sum ...

  6. DataTable数据批量写入数据库三种方法比较

    DataTable数据批量写入数据库三种方法比较 标签: it 分类: C#1)   insert循环插入:2)   sqldataadapter.update(dataset,tablename); ...

  7. c# applibrary实现一个Sheet表中存放多张DataTable数据

    1.工具类(applibrary.dll) public class ExcelHelper { /// <summary> /// 文件名 /// </summary> pu ...

  8. 【转】将datatable数据转化成list

    #region 将datatable数据转化成list   public static List<T> ToList<T>(this DataTable dt) where T ...

  9. DataTable数据与Excel表格的相互转换

    using Excel = Microsoft.Office.Interop.Excel; private static Excel.Application m_xlApp = null; /// & ...

随机推荐

  1. 慎用Outline ,UGUI Outline实现原理分析

    使用 UGUI 制作背包的时候.同事发现假设背包中加入了大量的物品.比方两百个.Unity就会出错,提示 Canvas element contains more than 65535 vertice ...

  2. Django打造大型企业官网(二)

    三.项目环境搭建 3.1.创建项目环境和安装包 创建django项目 mkvirtualenv DjangoProject workon DjangoProject pip install -i ht ...

  3. python爬虫实践--求职Top10城市

    前言 从智联招聘爬取相关信息后,我们关心的是如何对内容进行分析,获取用用的信息.本次以上篇文章“5分钟掌握智联招聘网站爬取并保存到MongoDB数据库”中爬取的数据为基础,分析关键词为“python” ...

  4. zipfile zip

    Python模块学习:zipfile zip文件操作 2015/05/27 · 系列教程 · zipfile 分享到:3 原文出处: DarkBull    最近在写一个网络客户端下载程序,用于下载服 ...

  5. Python按行输出文件内容具体解释及延伸

    下面两端測试代码分别为笔者所写,第一段为错误版本号.后者为正确版本号: #! /usr/bin/python2.7 try:     filename = raw_input('please inpu ...

  6. PHP MySQL mysql.sock的问题

    SQLSTATE[HY000] [2002] No such file or directory 原因是找不到mysql.sock这个文件..一般出现的症状就是能用ip连接mysql.但不能使用loc ...

  7. ModuleNotFoundError: No module named 'PIL'

    错误:ModuleNotFoundError: No module named 'PIL' 解决办法: pip install Pillow

  8. codeforces round 416 div2 补题 CF 811 A B C D E

    A. Vladik and Courtesy 水题略过 #include<cstdio> #include<cstdlib> #include<cmath> usi ...

  9. Vue.js实战 5.5章 购物车

    <!DOCTYPE html> <html lang="en"> <head> <title>购物车示例</title> ...

  10. 关于file文件操作的头文件 【LINUX】 (转载)

    转自:http://blog.csdn.net/figo77ll/article/details/3156052 Linux下如果要对文件进行读取访问,需要包含至少以下两个头文件: #inlcude ...