datatable重新加载ajax数据库,dataTables.js 重新加载数据

在使用dataTables的时候,实现自定义搜索后,请求了新的数据,但列表却没有刷新,百度/Bing了很多解决方法,基本是集中在两种:

方法 1:

dataTable.ajax.reload().draw();

方法 2:

dataTable.fnClearTable();

dataTable.fnDraw();

但是我一开始使用的时候,两种方法都不行,而且第二种还会报错。排查原因后,发现,dataTables在调用的时候,如果使用的是:$("").DataTable(...)的时候,方法 1可以,方法 2会报错,如果是使用的$("").dataTable(...)的时候,就刚好反过来。真是有点晕,为什么提供两种方法,然后返回的内容还不同。

我服务器返回的数据格式和dataTables的数据格式不完全一致,在数据返回的时候,需要做格式转换,如下:

dataFilter: function (data) {//格式过滤,必须返回string数据

var original = JSON.parse(data);

var dtData = {

draw: 1,

recordsTotal: original.property.total_size,

recordsFiltered: original.property.total_size,

data: original.list

};

if (original.error.err_msg != "") dtData.error = original.error.err_msg;

return JSON.stringify(dtData);

}

这个是jQuery.ajax的处理方案,具体的转换,可以查jQuery API手册。

后来发现,这个draw我是图方便,固定设置了1,而实际上,这个draw是每次都不一样,dataTables的要求是,将draw每样返回的。后来调整成这样:

dataFilter: function (data) {//格式过滤,必须返回string数据

var original = JSON.parse(data);

var draw = original.error.request_args.split(',')[0].split('=')[1]

var dtData = {

draw: parseInt(draw),

recordsTotal: original.property.total_size,

recordsFiltered: original.property.total_size,

data: original.list

};

if (original.error.err_msg != "") dtData.error = original.error.err_msg;

return JSON.stringify(dtData);

}

突然前面提到的两种方法,都可以了。

draw是绘制计数器。这个是用来确保Ajax从服务器返回的是对应的(Ajax是异步的,因此返回的顺序是不确定的)。 要求在服务器接收到此参数后再返回,详细见这里http://datatables.club/manual/server-side.html#returndata

看来,仔细阅读API说明,还是非常有必要的。

参与评论 您还未登录,请先 登录 后发表或查看评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
©️2022 CSDN 皮肤主题:游动-白 设计师:我叫白小胖 返回首页
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值