CODEWITHSUNDEEP
javascriptjsonrestextjsextjs4
Peter
Peter

Reputation: 1057

ExtJS store initialization using json fails

I have a store like this:

Ext.define('app.store.System', {
extend : 'Ext.data.Store',
model : 'app.model.System',
autoLoad: true,
autoSync: true,

proxy: {
    type: 'rest',
    format: 'json',
    url: '/application/appinfo',
    method : "GET",
    reader: {
        type: 'json',
        root: 'System'
    },
    writer: {
        root: 'System',
        allowSingle: false
    }
}
});

and I have a service endpoint to handle requests that match /application with this method:

@GET
@Path("/{sysinfo}")
public List<SystemInfo> getSystemInfo() {        
    if(sysinfo == null){
        sysinfo = new SystemInfo();

        ...initialize
    }

    List<SystemInfo> resultList = new ArrayList<SystemInfo>();
    resultList.add(sysinfo);

    return resultList;
}

and it seemed to work... when I tried to to reach localhost:port/application/sysinfo.json I got this:

{ [{"address":"...","feeds":["feed1","feed2"] } ] }

which seems correct but when I try to read the data from the store in the view's init method:

var store = Ext.StoreManager.lookup('System');
    var data = [];

    store.each(function(record) {
        data.push(record.getData());
        console.log("record data: ");
        console.log(record.getData());
    });

    console.log(data[0]);

It says that it's undefined as if the store was empty. I tried it with the debugger and i found that the getSystemInfo() was called after the view's initcomponent but unfortunately I don't know why that is or how to solve it. Any ideas?

Thanks for your time.

Upvotes: 1

Views: 753

Answers (2)

Boris Gappov
Boris Gappov

Reputation: 2493

Try this:

return new { success: true, System = resultList};

Upvotes: 1

Johan Haest
Johan Haest

Reputation: 4431

Have you tried loading your store first?

var store = Ext.StoreManager.lookup('System');
var data = [];
store.load({
   callback: function(storeVar, records, successful) {
      Ext.each(records, function(record) {
         data.push(record.getData());
         console.log("record data: ");
         console.log(record.getData());
      });
   }
   console.log(data[0]);
});

And what boris says is true, you need to define your root property in the returned JSON.

If you're using chrome or firefox you can also check which network call is made, and what it returns (JSON data...).

Upvotes: 1

Related Questions