"Sencha way" for interacting with server data is setting up an Ext.data.Store
proxied by a Ext.data.proxy.Proxy
(in this case Ext.data.proxy.Ajax
) furnished with a Ext.data.reader.Json
(for JSON-encoded data, there are other readers available as well). For writing data back to the server there's a Ext.data.writer.Writer
s of several kinds.
Here's an example of a setup like that:
var store = Ext.create('Ext.data.Store', {
fields: [
'counter_name',
'counter_type',
'counter_unit'
],
proxy: {
type: 'ajax',
url: 'data1.json',
reader: {
type: 'json',
idProperty: 'counter_name',
rootProperty: 'counters'
}
}
});
data1.json
in this example (also available in this fiddle) contains your data verbatim. idProperty: 'counter_name'
is probably optional in this case but usually points at primary key attribute. rootProperty: 'counters'
specifies which property contains array of data items.
With a store setup this way you can re-read data from the server by calling store.load()
. You can also wire the store to any Sencha Touch appropriate UI components like grids, lists or forms.