DataTables ajax重新加载数据

传数据给后台返回数据,最开始的办法是

重新生成一个datatable对象,但是在每次点击刷新时都会有闪动的现象,而且代价很高。理想中应该仅仅更新数据。

最后在文档中查到一个插件fnReloadAjax加入文件

$.fn.dataTableExt.oApi.fnReloadAjax = function ( oSettings, sNewSource, fnCallback, bStandingRedraw )

{

if ( sNewSource !== undefined && s NewSource !== null ) {

oSettings.sAjaxSource = sNewSource;

}

// Server-side processing should just call fnDraw

if ( oSettings.oFeatures.bServerSide ) {

this.fnDraw();

return;

}

this.oApi._fnProcessingDisplay( oSettings, true );

var that = this;

var iStart = oSettings._iDisplayStart;

var aData = [];

this.oApi._fnServerParams( oSettings, aData );

oSettings.fnServerData.call( oSettings.oInstance, oSettings.sAjaxSource, aData, function(json) {

/* Clear the old information from the table */

that.oApi._fnClearTable( oSettings );

/* Got the data - add it to the table */

var aData =  (oSettings.sAjaxDataProp !== "") ?

that.oApi._fnGetObjectDataFn( oSettings.sAjaxDataProp )( json ) : json;

for ( var i=0 ; i<aData.length ; i++ )

{

that.oApi._fnAddData( oSettings, aData[i] );

}

oSettings.aiDisplay = oSettings.aiDisplayMaster.slice();

that.fnDraw();

if ( bStandingRedraw === true )

{

oSettings._iDisplayStart = iStart;

that.oApi._fnCalculateEnd( oSettings );

that.fnDraw( false );

}

that.oApi._fnProcessingDisplay( oSettings, false );

/* Callback user function - for event handlers etc */

if ( typeof fnCallback == ‘function‘ && fnCallback !== null )

{

fnCallback( oSettings );

}

}, oSettings );

};

使用方法

oTable.fnReloadAjax(‘pages/getPlayerNewData.php);

oTable.fnReloadAjax(); //使用默认

http://yuklog.lofter.com/post/70cbd_8b6706

时间: 2024-10-04 11:23:05

DataTables ajax重新加载数据的相关文章

淘宝购物车页面 智能搜索框Ajax异步加载数据

如果有朋友对本篇文章的一些知识点不了解的话,可以先阅读此篇文章.在这篇文章中,我大概介绍了一下构建淘宝购物车页面需要的基础知识. 这篇文章主要探讨的是智能搜索框Ajax异步加载数据.jQuery的社区非常的活跃,许多朋友都在不同地方分享了很多优秀的插件.我在相关的网站上找过想实现类似功能的插件,但是没有找到.于是乎,自己动手丰衣足食.自己来搭建智能搜索框下拉列表.当然,如果有类似功能并且常维护Bug的插件,望留言交流. 源码地址: 淘宝购物车页面--PC端和移动端项目实战 首先需要先给大家打一根

使用ajax异步加载数据

使用ajax异步加载数据 controller为User赋值 @RequestMapping("/a2") public List<User> a2() { List<User> userlist = new ArrayList<User>(); userlist.add(new User("大头儿子", 6, "男")); userlist.add(new User("小头爸爸", 30,

Ajax动态加载数据

前言: 1.这个随笔实现了一个Ajax动态加载的例子. 2.使用.net 的MVC框架实现. 3.这个例子重点在前后台交互,其它略写. 开始: 1.控制器ActionResult代码(用于显示页面) /// <summary> /// 电话查询页面 /// </summary> /// <returns></returns> public ActionResult PhoneSearch(string sql) { phoneList=从数据库查询数据: V

echarts在.Net中使用实例(二) 使用ajax动态加载数据

前一篇文章链接:echarts在.Net中使用实例(一) 简单的Demo 通过上一篇文章可以知道和echarts参考手册可知,series字段就是用来存储我们显示的数据,所以我们只需要用ajax来获取series的值就可以. option 名称 描述 {color}backgroundColor 全图默认背景,(详见backgroundColor),支持rgba,默认为无,透明 {Array} color 数值系列的颜色列表,(详见color),可配数组,eg:['#87cefa', 'rgba

ajax(加载数据)

加载数据 1.xssj.php <script src="jquery-3.2.0.min.js"></script> <title>无标题文档</title> </head> <body> <h1>显示数据</h1> <select id="sel"> </select> <input type="button" val

Ajax异步加载数据及Redis缓存

针对网页分类条目的动态加载,图为页面的Head部分. //categoryListServlet准备分类数据 ProductService service = new ProductService(); List<Category> categoryList = service.findAllCategoryList(); response.setContentType("text/html; charset=utf-8"); Gson gson = new Gson();

zTree 树形控件 ajax动态加载数据

很久没搞过树形控件了 , 再次接触看官网文档有点没懂,于是在网上找了个代码copy上,但数据是写死的,就想这在用ajax异步取出数据替换,下面是js代码 <SCRIPT type="text/javascript" > //定义全局ztree数据 var zNodes; /* 初始化ztree数据 */ function initZtree(){ $.ajax({ type: "GET", url: "<%=request.getCont

Jquery chosen动态设置值 select Ajax动态加载数据 设置chosen和获取他们选中的值

在做一个编辑对话框时,要对里面带有select option的操作.主要是想动态加载option和对option的选中.但是由于项目中使用了jquery里的chosen()方法,怎么也无法实现效果.原码如下: Java代码   <select id="viewOLanguage" data-rel="chosen"> <option value="zh">简体中文(简体中文 Chinese)</option>

Select2插件ajax方式加载数据并刷新页面数据回显

今天在优化项目当中,有个要在下拉框中搜索数据的需求:最后选择使用selec2进行开发: 官网:http://select2.github.io/ 演示: 准备工作: 文件需要引入select2.full.js.select2.min.css(4.0.1版本)和jquery.1.8.3及以上 注意:最新版本的select2如果引用的jquery版本较低的话,某些功能无法正常使用. HTML代码 <select id="c01-select" class="select2&