Paging and filtering not working in extension js - javascript-framework

Question

In Extension grid paging and filtering is not working..please help me out.In this code if i replace store with simplestore and ds.load() with ds.loadData(mydata) then simple grid is working but paging is not working.but i have seen some samples according to these i have converted my code..but after that its not working at all.
Ext.onReady(function () {
var myData = [
['Apple', 29.89, 0.24, 0.81, '9/1 12:00am'],
['Ext', 83.81, 0.28, 0.34, '9/12 12:00am'],
['Google', 71.72, 0.02, 0.03, '10/1 12:00am'],
['Microsoft', 52.55, 0.01, 0.02, '7/4 12:00am'],
['Yahoo!', 29.01, 0.42, 1.47, '5/22 12:00am']
];
var ds = new Ext.data.Store({
pageSize: 2,
proxy: {
type: 'pagingmemory',
reader: { type: 'array' }
},
fields: [
{ name: 'company' },
{ name: 'price', type: 'float' },
{ name: 'change', type: 'float' },
{ name: 'pctChange', type: 'float' },
{ name: 'lastChange', type: 'date', dateFormat: 'n/j h:ia' }
]
});
var colModel = new Ext.grid.ColumnModel([
{ header: "Company", width: 120, sortable: true, dataIndex: 'company' },
{ header: "Price", width: 90, sortable: true, dataIndex: 'price' },
{ header: "Change", width: 90, sortable: true, dataIndex: 'change' },
{ header: "% Change", width: 90, sortable: true, dataIndex: 'pctChange' },
{ header: "Last Updated", width: 120, sortable: true,
renderer: Ext.util.Format.dateRenderer('m/d/Y'),
dataIndex: 'lastChange'
}
]);
var grid = new Ext.grid.GridPanel({ frame: true, height: 200, width: 600,ds: ds, cm: colModel, bbar: new Ext.PagingToolbar({
store: ds,
pageSize: 2,
displayInfo: true
})
});
ds.load();
grid.render(Ext.getBody());
});