-
15 Sep 2011 12:26 AM #1
Answered: Using JsonReader with sencha
Answered: Using JsonReader with sencha
Hello Everyone, I am brand new with forums, with sencha and json so, may sound very naive but hopefully you guys maybe able to help me because I am pounding on this from last 48 hours. Here is what I am doing in simplest terms:
I want to read a json string from remote URL using proxy, here is the complete code I am using in my customapp.js
and this is my test.json file:Code:Ext.onReady(function(){Ext.regModel('User', { fields: ['id', 'name', 'email'] }); var store = new Ext.data.Store({ model: 'User', autoLoad: true, proxy: { type: 'ajax', url : './test.json', reader: { type: 'json' } } }); console.log(store.getRange()); });
To point that, I simply wrote this string in a file, given it the extension of .json and saved it, nothing else I am doing here.Code:[{"id":1,"name":"Ed Spencer","email":"ed@sencha.com"},{"id": 2,"name":"Abe Elias","email":"abe@sencha.com"}]
The response in console.log I am seeing is '[]' empty array while if I dump whole of 'store', it has nothing in data.items, that means it's not reading json? Am I doing something wrong here?
-
Best Answer Posted by AndreaCammarata
Hi testbuilder.
You code is ok, however there is a little conceptual error:
The store takes a little time to load depending on how much it have to load and, in any case, you have to wait that the AjaxRequest is completed.
For this reason, when the
is executed, the store is still empty.Code:console.log(store.getRange());
If you want to see your loaded data, you can add to your store a "load" or "datachanged" listener in this way:
Hope this helps.Code:var store = new Ext.data.Store({ model: 'User', autoLoad: true, proxy: { type: 'ajax', url : 'test.json', reader: { type: 'json' } }, listeners: { load: function(){ console.log(store.getRange()); } } });
-
15 Sep 2011 12:58 AM #2
Hi testbuilder.
You code is ok, however there is a little conceptual error:
The store takes a little time to load depending on how much it have to load and, in any case, you have to wait that the AjaxRequest is completed.
For this reason, when the
is executed, the store is still empty.Code:console.log(store.getRange());
If you want to see your loaded data, you can add to your store a "load" or "datachanged" listener in this way:
Hope this helps.Code:var store = new Ext.data.Store({ model: 'User', autoLoad: true, proxy: { type: 'ajax', url : 'test.json', reader: { type: 'json' } }, listeners: { load: function(){ console.log(store.getRange()); } } });Sencha Inc
Andrea Cammarata, Solutions Engineer
CEO at SIMACS
@AndreaCammarata
www.andreacammarata.com
github: https://github.com/AndreaCammarata


Reply With Quote