Javascript 分页在extjs.d中不起作用

我得到一个json响应对象，并将其传递给gridgenerator函数。现在生成了网格s，我想对其进行分页。但我最终得到的是一个网格，它的所有记录都在一个页面中。浪费了五天。感谢您的帮助

Ext.require([ 'Ext.grid.*', 'Ext.data.*', 'Ext.util.*', 'Ext.state.*',
        'Ext.form.*','Ext.ux.LiveSearchGridPanel' ]);

Ext.onReady(function() {

    Ext.QuickTips.init();

    var bd = Ext.getBody();

    var simple = Ext.create('Ext.form.Panel', {

        frame : true,
        align : 'center',
        renderTo : Ext.getBody(),
        title : 'Simple Form',
        bodyStyle : 'padding:5px 5px 0',
        width : 600,
        fieldDefaults : {
            msgTarget : 'side',
            labelWidth : 75
        },
        defaultType : 'textfield',
        defaults : {
            anchor : '100%'
        },

        items : [ {
            fieldLabel : 'Date',
            xtype : 'datefield',
            name : 'start',
            id : 'start',
            format : 'dd-mmm-yyyy',
            allowBlank : false,
            cls : 'input_single',
            emptyText : 'dd-MMM-yyyy',

        }, {
            fieldLabel : 'Start Time',
            name : 'sTime',
            xtype : 'timefield',
            id : 'sTime',
            format : 'H:i',
            altFormats : 'H:i'

        }, {

            fieldLabel : 'End Time',
            name : 'eTime',
            xtype : 'timefield',
            id : 'eTime',
            format : 'H:i',
            altFormats : 'H:i'

        } ],
        buttons : [ {
            text : 'Submit',
            handler : function() {

                var startDate = Ext.getCmp('start').getValue();
                var sTime = Ext.getCmp('sTime').getRawValue();
                var eTime = Ext.getCmp('eTime').getRawValue();

                Ext.Ajax.request({
                    url : '/LogHandlers/Logging',
                    method : 'POST',
                    params : {
                        start : startDate,
                        startTime : sTime,
                        endTime : eTime
                    },

                    success : function(result, request) {

                        gridGenerate(result, request);

                    },
                    failure : function(result, request) {
                        alert('Error in server' + result.responseText);
                    }
                });
            }
        }]

    });
    function gridGenerate(result, request) {

        Ext.state.Manager.setProvider(Ext.create('Ext.state.CookieProvider'));

        var serverData = Ext.decode(result.responseText);

        // create the data store
        var store = Ext.create('Ext.data.JsonStore', {
            fields : [  {
                name : 'Date',
                type : 'string'
            },{
                name : 'TimeStamp',
                type : 'string'
            }, {
                name : 'loggerLevel',
                type : 'string'
            }, {
                name : 'LoggerName',
                type : 'string'
            }, {
                name : 'Method',
                type : 'string'
            }, {
                name : 'Message',
                type : 'string'
            }, {
                name : 'Customer Name',
                type : 'string'
            }, {
                name : 'ActivityName',
                type : 'string'
            }],
            data : serverData
        });

        // create the Grid
        var grid = Ext.create('Ext.grid.Panel', {
            store : store,
            stateful : true,
            stateId : 'stateGrid',
            columns : [  {
                header : 'Date',
                dataIndex : 'Date'
            },{
                header : 'Timestamp',
                dataIndex : 'TimeStamp'
            }, {
                header : 'LoggerLevel',
                dataIndex : 'loggerLevel'
            }, {
                header : 'LoggerName',
                dataIndex : 'LoggerName'
            }, {
                header : 'Method',
                dataIndex : 'Method'
            }, {
                header : 'Message',
                dataIndex : 'Message'
            } , {
                header : 'Customer Name',
                dataIndex : 'Customer Name'
            } , {
                header : 'ActivityName',
                dataIndex : 'ActivityName'
            } ],
            height : 550,
            width : 900,
            title : 'Logs',
             bbar: Ext.create('Ext.PagingToolbar', {
                    store: store,
                    pageSize: 20,
                    displayInfo: true,
                    displayMsg: '{0} - {1} of {2}',
                    emptyMsg: "No topics to display"
                }),
            renderTo : Ext.getBody(),

        });
    }
});

---

要使用Ext.PagingToolbar，您应该为服务器提供参数（如“start”和“limit”），服务器端代码应该读取这些参数并返回适当的数据。但如果要使用本地分页，请尝试Ext.ux.data.PagingStore扩展：

---

我的意思是，对于{start:0，limit:20}它应该返回前20条记录，对于{start:40，limit:20}它应该返回第三页。彻底阅读ExtJS API：分页通常在服务器端处理。客户端将参数发送到服务器端，服务器需要对其进行解释，然后使用适当的数据进行响应。是否有任何示例？实际上，我正在基于服务器端的响应对象调用外部函数。当点击3页时，它会发送带有以下参数的请求：topics browse remote.php？start=50&limit=25&。。。响应包含属性“totalCount:6679”。试试这个例子，使用JsonStore。