我有一个在浏览器端分页和过滤的ext js网格。例如，如果有3页，我应用过滤器来显示最后一页记录。然后它显示第一页和第二页空白，过滤后的数据显示在最后一页。我复制了下面的代码供您参考。您能建议这里有什么错误吗？

<script>
    Ext.Loader.setConfig({enabled: true});
    Ext.Loader.setPath('Ext.ux', '/extjs4/ux');

    Ext.require([
        'Ext.ux.grid.FiltersFeature'
    ]);

        Ext.Loader.setConfig({enabled: true});

        Ext.onReady(function() {

            Ext.QuickTips.init();
            Ext.tip.QuickTipManager.init();

            var data2='jsonData from Server';

            var mod2= Ext.define('Model', {

                extend: 'Ext.data.Model',
                fields: [ 
                    {name:'ID',mapping:'ID'}  ,
                    {name:'Creation Date/Time',mapping:'Creation Date/Time'} ,
                    {name:'Unit',mapping:'Unit'} 
                    ]        
            });

            var storeMain2 = Ext.create('Ext.data.Store', {
                model: mod2,
                autoLoad: false,
                buffered: false,
                pageSize: 10,
                data: Ext.decode(data2),
                proxy: {
                    type: 'pagingmemory',
                    reader: {
                        type: 'json',
                        root: 'user'
                        //totalProperty: 'totalCount'
                    }
                },
                remoteSort:true,
                remoteFilter:true,
                remoteGroup:true
            });

            var filters = {
                    ftype: 'filters',
                    autoReload: false,
                    encode: true,  
                    local: true   
                };

// grid with pagination
            var grid2 =  Ext.create('Ext.grid.Panel', {
                stateful: true,
                multiSelect: true,
                enableColumnMove:false,
                store:  storeMain2,
                stateId: 'stateGrid',
                autoHeight: true,
                autoWidth:  true,
                title: ' ',
                columnLines: true,
                renderTo: Ext.getBody(),
                features: [filters],
                filterable: true,

            columns: [
                    {
                        text     : 'ID',
                        sortable : true,
                        align:'center',
                        width:  70,
                        dataIndex: 'ID',
                        filter: { type: 'numeric'}
                    }, {
                        text     : 'Creation Date/Time',
                        width:  150,
                        sortable : true,
                        align:'center',
                        dataIndex: 'Creation Date/Time'
                    }, {
                        text     : 'Unit',
                        width:  150,
                        sortable : true,
                        align:'center',
                        dataIndex: 'Unit'
                    }
              ],
                listeners: {

                            'afterrender':function(e){
                                var gridthWidth = this.getWidth();
                                this.setWidth(gridthWidth);
                                this.setAutoScroll(true);
                            },
                            'columnresize': function(e){
                                var gridthWidth = this.getWidth();
                                this.setWidth(gridthWidth);
                                this.setAutoScroll(true);
                            } ,
                            render: function(e) {
                                this.store.on('load',function(){

                                });         
                            }
                        },
            bbar: Ext.create('Ext.PagingToolbar', {
                store: storeMain2,
                displayInfo: true,
                emptyMsg: "" 

            })        
        } );            
    });

</script>