Question

是否有针对YIU框架的AJAX分页？我试过Paginator View，但看起来它没有AJAX就会分页。根据我的理解，有一个单一的请求可以获取整个结果集，然后按页面细分，但是如果有几百万行呢？

以下是我的数据示例：

{
    totalItems: 1231313,
    itemsPerPage: 6,
    page: 1,
    users: [
        {
            userid: "Jf9CEy70",
            password: "g5JY9OB2",
            status_id: 1,
            expire_account: "2004-01-13 00:00:00",
            created: "2014-01-13 18:33:25"
        },
        {
            userid: "8LZVQX6b",
            password: "QFzO92tM",
            status_id: 1,
            expire_account: "2014-01-22 00:00:00",
            created: "2014-01-13 18:35:00"
        },
        {
            userid: "cItWduq9",
            password: "SuzcWisl",
            status_id: 0,
            expire_account: "0014-01-13 00:00:00",
            created: "2014-01-13 18:35:21"
        },
        {
            userid: "7QpP7Y7X",
            password: "Sp4p2EDB",
            status_id: 1,
            expire_account: "0014-01-13 00:00:00",
            created: "2014-01-13 18:36:31"
        },
        {
            userid: "NMr4U3Ei",
            password: "mC1s4RYb",
            status_id: 1,
            expire_account: "0014-01-13 00:00:00",
            created: "2014-01-13 18:40:48"
        },
        {
            userid: "qMjbSj7m",
            password: "h0QDpr2h",
            status_id: 1,
            expire_account: "0014-01-13 00:00:00",
            created: "2014-01-13 18:43:00"
        }
    ]
}

这是JS代码：

    YUI(
        {gallery: 'gallery-2013.01.16-21-05'}
    ).use(
        'gallery-datatable-paginator'
        , 'gallery-paginator-view'
        , 'datasource-io'
        , 'datasource-jsonschema'
        , 'datatable-base'
        , 'datatable-datasource'
        , 'datatable-scroll' 
        , function (Y) {
            var cols = [    
                { key: 'userid',    label: 'UserId'  }, 
                { key: 'password',  label: 'Password'  },
                { key: 'status_id', label: 'Status'  },
                { key: 'created',   label: 'Created'  },
            ];
            var url = '/app_dev.php/partner/api/users';
            var ds  = new Y.DataSource.IO({ 
                source:url
            });
            ds.plug(Y.Plugin.DataSourceJSONSchema, {
                schema: {resultListLocator: 'users'}
            });
            var pmodel = new Y.PaginatorModel({
                page:           1,
                itemsPerPage:   6,
                totalItems:     500
            });
            var dt = new Y.DataTable(
                {
                    columnset: cols
                    , paginator: new Y.PaginatorView({
                        model:              pmodel,
                        container:          '#pagBasicCCont',
                    })
                    , paginatorResize: true
                    , paginationSource: 'remote'
                }
            ).plug(
                Y.Plugin.DataTableDataSource
                , {datasource: ds}
            );
            dt.render('#data-tbl');
            dt.datasource.load();
        }
    );

Answer 1

http://yuilibrary.com/gallery/show/datatable-paginator非常适合服务器端分页。遗憾的是，文档和示例似乎处于脱机状态，但值得坚持不懈。您是否能够设置分页JSON数据的样子？

该插件需要这样的数据;

{
 totalItems:12931,
 itemsPerPage: 20,
 page:3,
 results:
 [
   {data record 1},
   {data record 2}
 }
}

哪种有意义，因为分页需要元数据才能为您呈现分页。

我找不到作者的详细联系方式，遗憾的是，如果这些例子可用，它会非常方便。如果我有机会在网上得到一个基本的例子并将其链接到这里。

YIU和AJAX分页

1 个答案: