PDA

View Full Version : GridPanel problem



nnicolson
28 Feb 2010, 10:53 PM
Hi All,

I am learning ExtJS and am working through some examples to aide in the process. I am trying to create a GridPanel from an array of data, and I am following along with ExtJS in Action. Here is the code I have which is causing me the problem:



var arrayData = [
['Jay Garcia', 'MD'],
['Aaron Baker', 'VA'],
['Susan Smith', 'DC'],
['Mary Stein', 'DE'],
['Bryan Shanley', 'NJ'],
['Nyri Selgado', 'CA']
];

var memoryProxy = new Ext.data.MemoryProxy(arrayData);

var nameRecord = Ext.data.Record.create([
{name : 'name', mapping : 1},
{name : 'state', mapping : 2}
]);

var arrayReader = new Ext.data.ArrayReader({}, nameRecord);

var store = new Ext.data.Store({
reader : arrayReader,
proxy : memoryProxy
});

When I add this to my gridpanel and viewport all I get is an empty grid (with headings). I can get it to work using the shorthand version, so I assume it is with the config of the data store that my issue lies:




var store = new Ext.data.ArrayStore({
data : arrayData,
fields : ['name' , 'state']
});

but it is really bugging me that I do not understand my error in the first effort.

And as a second little point, when I try to do this:




var store = new Ext.data.ArrayStore({
data : arrayData,
fields : ['name' , {name: 'state', mapping : 2}]
});

I also go no data displaying in my grid. Perhaps it is the mapping part I am getting wrong, but it's in there in all the examples I am reading. ~confused~

Animal
1 Mar 2010, 12:44 AM
Arrays are zero based in most languages.

Animal
1 Mar 2010, 12:46 AM
But you should get the two character ID loading into the "name" field, so that should display in the grid.

You need to check your dataIndex settings for the columns.

nnicolson
1 Mar 2010, 1:08 AM
OK, thanks, the array indexing error corrected the second snippet:




var store = new Ext.data.ArrayStore({
data : arrayData,
fields : ['name' , {name : 'state', mapping : 1} ]
});



But the correct array indexing has not helped with the full configuration, it is still not showing any data in my grid:




var arrayData = [
['Jay Garcia', 'MD'],
['Aaron Baker', 'VA'],
['Susan Smith', 'DC'],
['Mary Stein', 'DE'],
['Bryan Shanley', 'NJ'],
['Nyri Selgado', 'CA']
];

var memoryProxy = new Ext.data.MemoryProxy(arrayData);

var nameRecord = Ext.data.Record.create([
{name : 'name', mapping : 0},
{name : 'state', mapping : 1}
]);

var arrayReader = new Ext.data.ArrayReader({}, nameRecord);

var store = new Ext.data.Store({
reader : arrayReader,
proxy : memoryProxy
});



My columnmodel is configured like so:




var colModel = new Ext.grid.ColumnModel([
{
header : 'Full Name',
sortable : true,
dataIndex : 'name'
},
{
header : 'State',
sortable : true,
dataIndex : 'state'
}
]);

Animal
1 Mar 2010, 1:25 AM
You're not loading the Store.

kneth
1 Mar 2010, 1:31 AM
try setting autoLoad property of data store to true

nnicolson
1 Mar 2010, 11:05 PM
Thanks very much guys.