PDA

View Full Version : Help JSON and Ext.data.Store



alessiolu11484
9 Feb 2011, 6:06 AM
Hi, i'm a newbie and i don't know why don't return objects from this code...

Ext.regModel('User', {
fields: ['id','name','email']
});

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


var buttVedi = new Ext.Button({
text : 'Mostra',
ui : 'confirm-normal',
height:50,
width: 200,
listeners : {
click : {
element : 'el',
fn : function(){
Ext.Msg.alert('Result Json',store.first(),Ext.emptyFn);
}
}
}
});

the JSON code:

{
"id": 1,
"name": "Ed Spencer",
"email": "ed@sencha.com"
}

If someone can help me.. thanks, very, very much! =P~

Riaz
9 Feb 2011, 4:44 PM
What is the "root" of json ?

gp40
9 Feb 2011, 5:54 PM
Keep in mind I'm a newbie also. I would suggest putting your json data in [] to create an array. Then your store.first() should work.

alessiolu11484
10 Feb 2011, 3:12 AM
What is the "root" of json ?

Maybe i understand... i need the root in the json file... but if i don't have a root there is a way to load the file?
I have read the specific of JSON and i understand that isn' necessary a root... maybe i'm wrong..
Sorry for my bad english and thanks for your answers :D

moosgummi
10 Feb 2011, 5:53 AM
Try this:



Ext.regModel('Users', {
fields: [
{ name : "id" },
{ name : "name" },
{ name : "email" }
]
});

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


Your JSON should look like this:


{
"users" : [
{ "id" : 1, "name" : "foo", "email" : "foo@bar.com" },
{ "id" : 2, "name" : "foo", "email" : "foo@bar.com" },
...
]
}

gp40
10 Feb 2011, 7:00 AM
Your code works fine and you shouldn't need to specify a 'root;. All you need to do is enclose your json data in []. See below.

JSON:


[{
"id": 1,
"name": "Ed Spencer",
"email": "ed@sencha.com"
}]


Example:

Ext.regModel('User', {
fields: ['id','name','email']
});

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



Ext.setup({
onReady: function() {

var record = store.first();

var buttVedi = new Ext.Button({
text : 'Mostra',
ui : 'confirm-normal',
height:50,
width: 200,
listeners : {
click : {
element : 'el',
fn : function(){
Ext.Msg.alert( record.get('name'));
}
}}
});


new Ext.Panel({
fullscreen: true,
html: 'This is an example',
dockedItems: [{
xtype: 'toolbar',
title: 'Example',
items: [ buttVedi]
}]
});

}
});

alessiolu11484
10 Feb 2011, 1:56 PM
I have tried all of this.... but nothing... don't work...
Thanks all together ;)

Hertz
11 Feb 2011, 8:33 AM
Had the same problem.

For me, the solution was that i wasn't testing my application on a Web Server, so i copied my files to a local web server (using WAMP), tested the application, and now everything works. Your code is fine, just make sure your JSON data is valid (copy and paste it in a site like http://www.jsonlint.com/) and test your app on your local web server.

If your JSON data is not vaild, then follow the directions that gp40 is giving you.

alessiolu11484
13 Feb 2011, 1:37 PM
Thanks a lot everyone... but nothing of these work... I have tried to use a users.php ,instead of users.json, that generate json 'model', all inside MAMP but it says me that there aren't records in the store... is possible that there is a problem in the API of sencha touch? If someone have an idea tell me please!
Thank's a lot :(