Displaying object in grid?

[mythinky]

Hi all,

I am trying to get a list of Pet object and display in a grid.
Does anyone know why my grid doesnt display anything, even
PetService.getAllPets() return a list of pets?

What is the problem with the following javascript?



var Example = {
init : function(){
var recordType = Ext.data.Record.create([
{name: "id", type: "string"},
{name: "name", type: "string"},
{name: "type", type: "string"}
]);

var ds = new Ext.data.Store({
proxy: new Ext.data.DWRProxy(PetService.getAllPets, true),
reader: new Ext.data.ListRangeReader(
{id:'id'}, recordType),
remoteSort: true
});

var colModel = new Ext.grid.ColumnModel([
{id:'id', header: "Id", width: 160, sortable: true, dataIndex: 'id'},
{header: "Name", width: 75, sortable: true, dataIndex: 'name'},
{header: "Type", width: 75, sortable: true, dataIndex: 'type'}
]);


// create the Grid
var grid = new Ext.grid.Grid('grid-example', {
ds: ds,
cm: colModel,
autoExpandColumn: 'id'
});

var layout = Ext.BorderLayout.create({
center: {
margins:{left:3,top:3,right:3,bottom:3},
panels: [new Ext.GridPanel(grid)]
}
}, 'grid-panel');

grid.render();
ds.load();

grid.getSelectionModel().selectFirstRow();
}
};
Ext.onReady(Example.init, Example);


Great thanks :)

[Animal]

So getAllPets returns a ListRange object does it? Of the kind that ListRangeReader knows how to deal with?