extjs4 - ExtJS 4.2 网格分页

Question

我希望对通过 Web 服务接收数据的网格面板进行客户端分页，但我不确定如何继续执行此操作。

这是我到目前为止的代码。分页工具栏显示正确的页数，但是所有结果都显示在第一页中。在页面中前进和后退没有任何区别。

型号

Ext.define('MCS.model.task.myModel', {
extend: 'Ext.data.Model',
fields:
[
    { name: 'Case_ID', type : 'Auto' },
    { name: 'BP_Name', type : 'Auto' },
    { name: 'Project', type : 'Auto' }
],

proxy:
{
    type: 'ajax',
    url: '/Service/Task?type=mytasks',
    reader:
    {
        type: 'json',
        root: 'data'
    },
},
});

商店

Ext.define('MCS.store.task.myStore', {
extend: 'Ext.data.Store',
requires: 'MCS.model.task.myModel',
model: 'MCS.model.task.myModel',

pageSize : 10,

autoLoad: true
});

网格面板

Ext.define('MCS.view.task.myGrid', {
extend: 'Ext.grid.Panel',
alias: 'widget.myGrid',

store: 'task.myStore',
columns: [],

dockedItems:
[
    { xtype: 'myToolbar', 
        dock: 'top',
    },
    { xtype: 'pagingtoolbar',
        dock: 'bottom',
        displayMsg: '{0} - {1} of {2}',
        emptyMsg: 'No data to display',
        store: 'task.myStore'
    }
],

initComponent: function ()
{
    this.columns =
    [
        { text: 'Case ID', dataIndex: 'Case_ID' },
        { text: 'Business Partner Name', dataIndex: 'BP_Name' },
        { text: 'Project', dataIndex: 'Project' }
    ];

    this.callParent();
}
});

Answer 1

Ext.define('Crm.store.Companies', {
   extend: 'Ext.data.Store',
   requires: 'Crm.model.Company',
   model: 'Crm.model.Company',
   autoLoad: {start: 0, limit: 5},
   pageSize: 5,
   remoteSort: true,
   sorters: [{
              property : 'name',
              direction: 'asc'
          }],
   proxy: {
     type: 'rest',
     url : 'service/companyList/json',
     reader: {
        type: 'json',
        root: 'companyList',
        totalProperty: 'total'
     }
   }
});