bootstrap datatable 数据刷新问题

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

$(document).ready(function() {
    $('#example1').DataTable({
        "bPaginage": false,
        "sPaginationType": "full_numbers",
        "oLanguage": {
            "sLengthMenu": "每页显示 _MENU_ 条",
            "sZeroRecords": "没有找到符合条件的数据",
            "sInfo": "当前第 _START_ - _END_ 条 共计 _TOTAL_ 条",
            "sInfoEmpty": "没有记录",
            "sInfoFiltered": "(从 _MAX_ 条记录中过滤)",
            "sSearch": "搜索",
            "sProcessing": "数据加载中...",
            "oPaginate": {
                "sFirst": "首页",
                "sPrevious": "上一页",
                "sNext": "下一页",
                "sLast": "尾页"
            }
        },
        "aoColumns": [
            {
                "sDefaultContent": "",
                fnRender: function (obj) {
                    return "<input type='checkbox'  name='checkbox1'/>"
                }
            },
            {"mData": "column_name"},
            {"mData": "data_type"},
            {"mData": "column_comment"}
        ]
    });
    $('#example2').DataTable({
        "bProcessing":false,
        "bFilter" : true,
        "bPaginate": true,
        "sPaginationType": "full_numbers",
        "bSort": true,
        "oLanguage": {
            "sLengthMenu": "每页显示 _MENU_ 条",
            "sZeroRecords": "没有找到符合条件的数据",
            "sInfo": "当前第 _START_ - _END_ 条 共计 _TOTAL_ 条",
            "sInfoEmpty": "没有记录",
            "sInfoFiltered": "(从 _MAX_ 条记录中过滤)",
            "sSearch": "搜索",
            "sProcessing": "数据加载中...",
            "oPaginate": {
                "sFirst": "首页",
                "sPrevious": "上一页",
                "sNext": "下一页",
                "sLast": "尾页"
            }
        },
        "aoColumns": [
            {"mData": "column_name"},
            {
                "sDefaultContent": "",
                fnRender: function (obj) {
                    return "<input type='checkbox'  name='checkbox2'/>"
                }
            },
            {
                "sDefaultContent": "",
                fnRender: function (obj) {
                    return "<button class='btn'  " +
                            "style='margin-top: -2px;margin-bottom: -18px;padding-top: 3px;height: 24px!important;" +
                            "font-size: 8px;color: snow' " +
                            "onclick=dl(this)>删除</button>"
                }
            }
        ]
    });
});
var table2 = $('#example2').dataTable();
oSettings = table2.fnSettings();
$.getJSON("transform.action?data="+data.join(","), null, function( json )
{
    for (var i=0; i<json.aaData.length; i++)
    {
        table2.oApi._fnAddData(oSettings, json.aaData[i]);
    }
    oSettings.aiDisplay = oSettings.aiDisplayMaster.slice();
    table2.fnDraw();
});

//也许你还可能用到这几个方法:
table = $('#e
xample1').dataTable();
oSettings = table.fnSettings();
table.fnClearTable(this);

一个简单的方法…
$(‘YourDataTableID’).dataTable()._fnAjaxUpdate();
它将通过与非常简单的ajax请求刷新数据。
如果有什么工作!做到这一点: 例如:

  • 3
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值