0

使用 ExtJS 4.2 - 我有一个 AJAX 调用用 JSON 格式的整个结果集填充存储（使用 loadRawData）。我现在需要限制一次在网格上显示的结果数量。最终目标是实现客户端分页。我尝试过使用 pagingmemoryproxy，但运气不佳。

Ext.define('TestApp.view.TestGrid' , {
extend: 'Ext.grid.Panel',
alias: 'widget.testgrid',

requires:[
    'TestApp.store.TestStore'
],

initComponent: function() {
    var me = this;
    this.store = Ext.create('Ext.data.Store', {
        model: 'TestApp.model.TestModel',
        proxy: {
            type: 'memory',             
            reader: {
                 type: 'json'
            },
        },  
        pageSize: 20
    });

// set the maxRows parameter based on the store's page size
    this.maxRows = this.store.pageSize;
    this.columns = this.buildColumns();
    this.bbar = Ext.create('Ext.PagingToolbar', {
        itemId: 'pagingToolbar',
        store: this.store,   
        dock: 'bottom',
        displayInfo: true
    });
    this.callParent();
}

我的控制器使用以下 AJAX 调用

Ext.Ajax.request({
        url: '/testing/test',
        method: "POST",
        jsonData : requestParams,
        timeout: 120000,    
        headers: {
            'Accept': 'application/json',
            'Content-Type': 'application/json'
        },
        success: function(response) {
            var resp = Ext.decode(response.responseText);
            var testStore = testGrid.getStore();

            var numResults = response.getAllResponseHeaders().resultlength;

            // this successfully loads results into store and populates grid 
            // with pagingtoolbar displaying page 0 of 0
            testStore.loadRawData(resp);  


            //testStore.loadPage(1);

        },
4

1 回答 1

0

您需要将分页工具栏添加到网格中。

基本上你需要做三件事：

1) 将分页工具栏添加到网格 2) 网格使用的存储应赋予'pageSize' 属性 3) 如果使用 loadrawdata，则需要在加载后更新工具栏使用。为此使用 loadPage 函数。

以下主题将帮助您入门：如何正确管理 Ext-js 4.2 中的 PagingToolbar？

于 2013-10-03T14:49:01.723 回答