PDA

View Full Version : Problem with lists and json



peraskeli
30 Sep 2011, 8:04 AM
I am new to Sencha Touch, and I've tried a couple of examples on the internet. This is one that I simply can not get to work. Trying in Chrome and Android 2.3.3 but the list appears to be empty. Am I doing something wrong here?


Ext.setup({
onReady : function() {

Ext.regModel('Contact', {
fields: ['firstName', 'lastName']
});

var store = new Ext.data.Store({
model: 'Contact',
proxy: {
type: 'ajax',
url : 'test.json',
reader: {
type: 'json'
}
}
});

var list = new Ext.List({
fullscreen: true,

itemTpl : '{firstName} {lastName}',
store: store
});
list.show();}});

The JSON file:


[
{
"firstName": "pelle",
"lastName": "ollesson"
},
{
"firstName": "nisse",
"lastName": "pellssdfok"
}
]

NickT
30 Sep 2011, 9:30 AM
add the 'autoLoad: true' config property to your Store definition to initiate loading of data automatically, otherwise, you have to invoke it manually.


var store = new Ext.data.Store({ model: 'Contact',
autoLoad: true,
proxy: {
type: 'ajax',
url : 'test.json',
reader: {
type: 'json'
}
}
});

peraskeli
30 Sep 2011, 10:19 AM
I read somewhere that the store on Sencha Touch 1.0.1 is broken, but can not find out what version I have. Could this be the problem?

NickT
30 Sep 2011, 10:39 AM
Here is the test I just tried locally,

28447


Ext.regModel('Contact', { fields: ['firstName', 'lastName']
});


var store = new Ext.data.Store({
autoLoad: true,
model: 'Contact',
proxy: {
type: 'ajax',
url : '/sampledata.json',
reader: {
type: 'json'
}
}
});


var tpl = new Ext.XTemplate(
'<tpl for=".">',
'<div class="thumb-wrap" id="{name}">',
'<span class="x-editable">{firstName} {lastName}</span></div>',
'</tpl>',
'<div class="x-clear"></div>'
);




var dView = new Ext.List({
store: store,
itemTpl: tpl,
autoHeight:true,
multiSelect: true,
overItemCls:'x-view-over',
itemSelector:'div.thumb-wrap',
emptyText: 'No images to display'
});




then displayed it by dropping it into a panel ...

{ fullscreen: true,


items: [
dView
]
}

my sampledata.json is as you had defined in your sample data..


[ {
"firstName": "pelle",
"lastName": "ollesson"
},
{
"firstName": "nisse",
"lastName": "pellssdfok"
}
]

peraskeli
1 Oct 2011, 2:44 AM
Thank you for your help. This worked!