PDA

View Full Version : JSONReader and anonymous parent array



mack30
1 Apr 2012, 7:40 PM
I've not been able to determine how to read the following server data via a json reader and display it in a list.

The server data is a single element anonymous array that wraps an array of Message. I am interested in the inner Message array.


[
{"Message":
[
{
"messageID": "1",
"title": "Alpha"
},
{
"messageID": "2",
"title": "Beta"
}
]
}
]


I am using the Tweets page of the Sencha Touch O'Reilly example as the base of my experiments. The view look likes this:

itemTpl: Ext.create('Ext.XTemplate',
'hello ',
'<h2>{messageID} {title}</h2>'
)


and the Store looks like this:


Ext.define('Oreilly.store.Tweets', {
extend: 'Ext.data.Store',


config: {
fields: ['messageID', 'title'],
proxy: {
type: 'ajax',
url: 'http://myserver/messages',
headers: {
'MyHeader': 'abc123'
},
cors: true,


reader: {
type: 'json',
//rootProperty: 'Message'
rootProperty: 'dummy[0].Message'
}


}
}
});


Any help will be appreciated.

skirtle
1 Apr 2012, 8:10 PM
Try:


root: '[0].Message'

mack30
1 Apr 2012, 8:39 PM
thanks for the reply skirtle, but no luck with the

root: '[0].Message'

vietits
1 Apr 2012, 9:12 PM
Let have a try:


Ext.define('Oreilly.store.Tweets', {
extend: 'Ext.data.Store',
fields: ['messageID', 'title'],
proxy: {
type: 'ajax',
url: 'http://myserver/messages',
headers: {
'MyHeader': 'abc123'
},
cors: true,
reader: {
type: 'json',
getResponseData: function(response) {
data = Ext.decode(response.responseText);
return data ? data[0].Message : {};
}
}
}
});

mack30
2 Apr 2012, 6:00 AM
It seems that the getResponseData function is not entered. I added some alerts and a breakpoint.


reader: {
type: 'json',
getResponseData: function(response) {
alert('response: '+ response)
data = Ext.decode(response.responseText);
alert('data: '+ data)
return data ? data[0].Message : {};
}
}


There are two servers involved. One for the web app and another for the ajax data. Both servers belong to us but it is a cross domain call.

Does the cross domain aspect play into this issue?
I know that the data is retrieved from the server as I am monitoring via Fiddler2.

I first see the OPTIONS request go out - a response of 200 is returned
next the GET is issued - the response is 200 and I see my data (on the Fiddler console)

vietits
2 Apr 2012, 6:25 AM
Make sure that your data is successfully loaded from server. I have tested this code successfully with an exception is that data is loaded from the same domain not cross domain.

mack30
2 Apr 2012, 7:28 AM
Thanks vietits. Do you have any hints on how to confirm that the data is being loaded?
i.e. where might I put down some breakpoints?

I know that the data is returned from the server because I see it in the Fiddler2 console.

My testing has been with Win7 Safari.

mack30
4 Apr 2012, 4:28 AM
33572

skirtle
4 Apr 2012, 4:29 AM
Seems you're using Sencha Touch, not ExtJS 4. You did mention this in your original post but I missed it. Please post your question in the Touch forums.