文章目录
[隐藏]
现在主流的前端UI框架封装的datagrid基本都带有分页能力,而且做的很到位,大部分是根据URL的方式调用远程地址获取json格式的数据源,这很大程度上给开发者节省了时间。
不过问题是,并不是所有的异步请求的方式我们都使用URL,比如用spring和dwr框架来实现异步,或者是我们公司封装的callRemoteFunctionNoTrans异步方法,每次获取数据都是在前台javascript中调用,分页当然就不能靠URL了。
jQuery easyui datagrid 的相关文档都翻遍了,还真是没有不通过URL实现后台分页的现成API,不过既然 easyui datagrid 已经有了pageNumber和pageSize属性,我们对源码稍作修改便能实现这个API。
实现思路:
给easyui datagrid 添加一个方法,该方法类用于改变datagrid自身的分页参数,以及异步获取数据并加载获取到的数据。
代码修改:
一:定义默认的doPagination(pageNumber,pageSize)事件:
找到datagrid定义默认方法的地方,1.2.5版本在7610行附近(实在找不到的话,在压缩码里搜索"$.fn.datagrid.defaults")然后添加以下代码:
- ,doPagination:function(pageIndex,pageSize){}
二:修改pagination的onSelectPage事件:
onSelectPage事件在6162行附近(实在找不到的话,在压缩码里搜索"pagination"),修改为:
- onSelectPage:function(_406,_407){
- opts.pageNumber=_406;
- opts.pageSize=_407;
- opts.doPagination(_406,_407);
- _4b6(_3fc);
- }
2012-3-2更新(bug修正):
前面在对onSelectPage事件的处理上存在不足之处,如果是url方式调用的话,会存在脚本报错。报错原因是url方式调用的时候用户不会定义doPagination事件,从而出现未定变量的错误。
也就是说url方式的时候不应该调用doPagination了,所以应该修正代码为:
- opts.pageNumber=_406;
- opts.pageSize=_407;
- if(!opts.url){
- opts.doPagination(_406,_407);
- }
- _4b6(_3fc);
管理员 世纪之光 : 2012年09月04日22:24:40 -47楼
管理员 世纪之光 : 2012年11月01日18:17:35 地下1层
管理员 世纪之光 : 2013年08月18日23:51:02 地下1层
管理员 世纪之光 : 2013年11月19日09:34:11 地下1层
管理员 世纪之光 : 2013年11月19日09:30:32 地下1层
管理员 世纪之光 : 2013年11月20日20:08:34 地下1层