YUI动态分页-paginator

2012-11-25

YUI动态分页--paginator花了三天研究YUI的paginator，最终用2.5的版本跑通，让我很郁闷的是我今天下午刚发现

YUI动态分页--paginator

花了三天研究YUI的paginator，最终用2.5的版本跑通，让我很郁闷的是我今天下午刚发现2.8的paginator官方示例（http://webbits.pl/yui/examples/datatable/dt_serverpagination.html）就是有bug的，示例的数据loading后就一直出不来，现在再去看竟然好了，看了页面源码后发现是做过了修改，我可是对着不能执行的代码研究了好长时间啊。

那现在就先记录下YUI2.5成功动态分页的代码：

1、首先是YUI依赖的js文件，顺序应该有要求的，我换过顺序是有问题的：）

? 
2、分页组件在以下html标签下生成
?
?
YUI2.8的动态分页代码：
?
?? html标签部分
?
?
?上面这部分就是官网演示的例子代码，显然这部分代码是无法解决第一次回调获取table数据的，看了现在成功示例的页面源文件后发现加了下面代码
?
// Global init var to run Loader only oncevar gRunInit = true;var gRunDataTable = true;YAHOO_config = {    load: {        require: ['yahoo'],        base: '../../build/',        onLoadComplete: function(loader) {            if(gRunInit) {                gRunInit = false;                YAHOO.example.checkJson = function(name, loaderCallback) {                    if (Object.prototype.toJSONString) {                        loaderCallback();                    } else {                        setTimeout(function() {                                YAHOO.example.checkJson(name, loaderCallback);                            }, 3);                    }                };                loader.addModule({                    name: "json",                    type: "js",                    fullpath: "assets/js/json.js",                    verifier: YAHOO.example.checkJson                });                loader.require("fonts", "json", "connection", "datatable");                loader.onLoadComplete = function(loader) {                    if(gRunDataTable) {                        gRunDataTable = false;              YAHOO.example.ServerPagination = new function() {                     .......................//接上面代码段              }              loader.insert();            }        }
?
这样就成功初始化了第一次请求的数据，后面就点击前页后页出发回调时间进行动态分页了

热点排行

Web前端

YUI动态分页-paginator