CODEWITHSUNDEEP
jsonextjs4
user1415459
user1415459

Reputation: 159

Loading data from a json file into extjs

I have a .json file whose content is supposed to be read by Ext.data.Store and displayed by Ext.grid.Panel (extjs 4). However, no data is displayed, only the grid is. The code is:

var user = Ext.create('Ext.data.Store', {
    storeId: 'user',
    model: 'User',
    autoLoad: 'true',
    proxy: {
        type: 'ajax',
        url : '/users.json',
        reader: {type: 'json', root: 'blah'}
    }
});

 Ext.create('Ext.grid.Panel',{
    store :user,
    id : 'user',
    title: 'Users',
    columns : [ 
        {header: 'ID',     dataIndex : 'id'}, 
        {header : 'NAME',  dataIndex : 'name'}, 
        {header : 'Email', dataIndex: 'email'}
    ],
    height :300,
    width: 400,
    renderTo:'my-portlet2'
});

and my json file is:

{ blah[
  {
    "id": 1,
    "name": "Ed Spencer",
    "email": "[email protected]"
  },
  {
    "id": 2,
    "name": "Abe Elias",
    "email": "[email protected]"
  }
]}

Inline data gets displayed but when i am trying to read from a json file, it does not work. I am using firefox and firebug says that there is an error loading the script from my .js file. Could you please help? Thanks!

Upvotes: 4

Views: 10471

Answers (2)

user1415459
user1415459

Reputation: 159

Thanks a lot everyone. It is working fine now. The server could not find the files because the path was not proper. After experimenting a bit, I was finally able to fetch the json data from the json file by giving a proper path, like - "TestPortlet3-portlet/js/example.json". Initially, I was only giving "/example.json" or "users.json". On keeping the .json file in the correct folder and giving the correct path, I was able to display the json data :)

Upvotes: 3

Izhaki
Izhaki

Reputation: 23586

Try this:

{ "blah": [
  {
    "id": 1,
    "name": "Ed Spencer",
    "email": "[email protected]"
  },
  {
    "id": 2,
    "name": "Abe Elias",
    "email": "[email protected]"
  }
]}

Upvotes: 0

Related Questions