extjs4 with memoryproxy and pagination

1.2k Views Asked by At

I have this very basic example where I use a memoryproxy and pagingmemory toolbar to paginate through data (ideally).

This is extjs working with meteor which sends data directly without the need of a res/ajax/jsonp proxy so I must use memory since the data is already in the client long before extjs has even managed to render it's views.

My problem is that I cannot make the pagination to show a real overview of what's in the store. The refresh is not working and the paginate icons are dead since the pagination sees no items in the store after I load them.

I have a working code example up on jsfiddle: http://jsfiddle.net/rXsVG/5/

Full code example:

Ext.onReady(function(){
    Ext.define('User', {
        extend: 'Ext.data.Model',
        fields: [
            {name: 'id',    type: 'int'},
            {name: 'name',  type: 'string'}
        ]
    });

    var store = new Ext.data.Store({
        model: 'User',
        autoLoad: true,
        proxy: {
            type: 'pagingmemory',
            reader: {
                type: 'json'
            }
        }
    });

    Ext.create('Ext.grid.Panel', {
        height: 500,
        width: '100%',
        renderTo: 'example-grid',
        store: store,
        columns: [{
            header: 'Name',
            dataIndex: 'name',
            flex: 1
        }],
        bbar: {
            xtype: 'pagingtoolbar',
            pageSize: 10,
            store: store,
            displayInfo: true
        },
        listeners: {
            afterrender: function(grid, evt) {
                console.log('Loading data');
                var data = [];
                for(var i = 1; i < 20; i++) {
                    data.push({
                        id: i,
                        name: 'Ed Spencer '+i
                    });
                }

                //    Simulate a really busy server call
                setTimeout(function(){
                    grid.getStore().loadData(data);
                }, 500);
            }
        }

    });
});

Also if you hit refresh on the paging toolbar all data will be gone. Any ideas?

0

There are 0 best solutions below