首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > Web前端 >

自定义jQuery easyui datagrid的loader适配器,兑现datagrid的前端分页

2012-07-01 
自定义jQuery easyui datagrid的loader适配器,实现datagrid的前端分页?本方法适用于的于jQuery easyui 1.2

自定义jQuery easyui datagrid的loader适配器,实现datagrid的前端分页

?

本方法适用于的于jQuery easyui 1.2.6+版本低于1.2.6的版本不能使用改方法。

loader适配器的实现代码如下:

?

function myLoader(param,success,error){var that = $(this);var opts = that.datagrid("options");if (!opts.url) {return false;}var cache = that.data().datagrid.cache;if (!cache) {$.ajax({type : opts.method,url : opts.url,data : param,dataType : "json",success : function (data) {that.data().datagrid['cache'] = data;success(bulidData(data));},error : function () {error.apply(this, arguments);}});} else {success(bulidData(cache));}function bulidData(data) {var temp = $.extend({},data);var tempRows = [];var start = (param.page - 1) * parseInt(param.rows);var end = start + parseInt(param.rows);var rows = data.rows;for (var i = start; i < end; i++) {if(rows[i]){tempRows.push(rows[i]);}else{break;}}temp.rows = tempRows;return temp;}}

?具体使用:配置datagrid的loader属性为myLoader即可。

?

当你需要重新请求后台刷新数据时,请在你调用刷新方法之前执行$("#gridId").data().datagrid.cache = null; 该语句作用于清除当前缓存。

当然你实现的是前端分页。所以你后台返回的应该是该结果集下所有的记录。并且请不要在后天处理分页参数。后台返回的结果格式应该如是:{"total":106,"rows":[{},{},{}.....]},且rows.length的长度应该等于total的值。

http://easyui.btboys.com/post-81.html

?

热点排行