Question

我是Ext JS的新手。我刚才提到了在Sencha Ext Js中发布的示例，目前正在使用网格中的Paging。我不确定分页如何工作，并对此有一点疑问。问题是分页工具栏显示在网格的底部。但是所有记录都显示在同一页面中。我尝试在类似的论坛甚至autoLoad函数中建议的商店内设置pageSize，但它不能正常工作。以下是我在数据存储区，网格和分页工具栏中使用的示例代码段。

DataStore代码：

var itemPageSize = 5;
var bulkDevStore = Ext.create('Ext.data.ArrayStore', {
         pageSize: itemPageSize,
        fields : [ {
            name : 'date'
        }, {
            name : 'userid'
        }, {
            name : 'filename'
        }

        ],

          autoLoad:{ start: 0, limit: itemPageSize} 

    });

Grid Snippet：

var bulkStatsGrid = Ext.create('Ext.grid.Panel', {
        columnLines : true,
        width:'100%',
        height:'100%',
        title : "Statistics",
        store : bulkDevStore,
        disableSelection: true,
        loadMask: true,
        id : 'bulkstatsgrid',

            columns : [ {
            text : 'Date',
            width : '10%',
            sortable : false,
            dataIndex : 'date'
        }, {
            text : 'User Id',
            width : '10%',
            sortable : true,
            dataIndex : 'userid'
        }, {
            text : 'File Name',
            width : '79.8%',
            sortable : true,
            dataIndex : 'filename'
        } ],

Paging片段：

            bbar: Ext.create('Ext.PagingToolbar', {
        store: bulkDevStore,
        refresh : false,
        displayInfo: true,
        displayMsg: 'Displaying topics {0} - {1} of {2}',
        emptyMsg: "No topics to display",

但它始终显示，第0页为0。整个事情似乎都被禁用了。有什么帮助吗？

Answer 1

确保您拥有total属性：

...
total: 'value.total',
pageSize: 5,
...

在商店的数据响应中需要提供总属性。

尽量不要autoload商店，但在创建商店和工具栏后，请致电store.load()

Answer 2

它显示0页0，因为您没有向数据存储区提供任何数据，
使用数据配置来提供数据。

http://docs.sencha.com/extjs/4.1.3/#!/api/Ext.data.ArrayStore

分页不在Ext JS中工作

2 个答案: