ExtJs Grid with data from JsonStore not loading

Hy everyone, I have ExtJS 3.2 , PHP5.3 and Oracle 10g XE.

JSON returned from MyExtJs.php :

---

[{"FIRST_NAME":"Ellen","LAST_NAME":"Abel"},{"FIRST_NAME":"Sundar","LAST_NAME":"Ande"}, {"FIRST_NAME":"Mozhe","LAST_NAME":"Atkinson"},{"FIRST_NAME":"David","LAST_NAME":"Austin"},{"FIRST_NAME":"Hermann","LAST_NAME":"Baer"},{"FIRST_NAME":"Shelli","LAST_NAME":"Baida"},{"FIRST_NAME":"Amit","LAST_NAME":"Banda"},{"FIRST_NAME":"Elizabeth","LAST_NAME":"Bates"},{"FIRST_NAME":"Sarah","LAST_NAME":"Bell"},{"FIRST_NAME":"David","LAST_NAME":"Bernstein"}]

---

The data store:

var store 开发者_StackOverflow= new Ext.data.JsonStore( {  
                  autoLoad: true,  
                  url: 'MyExtJs.php',  
                  fields: [  
                           {name: 'firstname'},  
                           {name: 'lastname'}  
                          ]  
                                     });

The Grid:

var grid = new Ext.grid.GridPanel({
        store: store,
        columns: [
            {
                id       : 'fname',
                header   : 'First Name', 
                width    :  160, 
                sortable :  true, 
                dataIndex: 'firstname'
            },
            {
                id       : 'lname',
                header   : 'Last Name' ,
                width    :  75, 
                sortable :  true,  
                dataIndex:  'lastname'
            }
                ],
        stripeRows: true,
        height: 300,
        width: 500,
        title: 'Report', 
        autoExpandColumn: 'lname',   
        stateful: true,
        stateId: 'grid'
                                  });

I only shows the header and borders of the grid but no data inside.

Kind Regards, Dan

---

In your fields config include a "mapping" property like this:

var store = new Ext.data.JsonStore( {  
    autoLoad: true,  
    url: 'MyExtJs.php',  
    fields: [  
        {name: 'firstname', mapping:'FIRST_NAME'},  
        {name: 'lastname', mapping:'LAST_NAME'}  
    ]  
});

It is not the Ext.data.Store that reads your JSON, it uses Ext.data.DataReader intenally to read data coming from server, this "fields" prop set in Store's config is passed to its DataReader to configure itself. DataReader uses Ext.data.Field for each field being read, look here, ExtJS's docs are good!