PDA

View Full Version : Type Error cannot read property 'length' - on json request



nneuberger1
21 Sep 2011, 11:12 AM
I'm building an example that's based exactly after the Oreilly example that makes a json request. Mine is going to a Rails service using ActiveRecord output, but I keep failing on this "length" error.

Any ideas.


store: new Ext.data.Store({
model: 'Client',
autoLoad: true,
proxy: {
type: 'ajax',
url : 'http://localhost:3000/clients.json',
reader: {
type: 'json',
root: 'clients'
}
}
}),




The response returns the following which does return an OK response as application/json as well.



[
{
"client": {
"created_at": "2011-09-15T03:56:15Z",
"customerSinceDate": "2007-07-04",
"lastName": "Flintstone",
"lastVisitedDate": "2011-08-06",
"twitterUserId": "IuseStoneForMessagingIf",
"updated_at": "2011-09-15T03:56:15Z",
"dateOfBirth": "2006-09-15",
"middleName": "",
"facebookUserId": "fredIsWayOldForFB",
"id": 1,
"userId": "fredflintstone1",
"firstName": "Fred",
"description": "Freddie flintster"
}
},
{
"client": {
"created_at": "2011-09-15T04:15:17Z",
"customerSinceDate": "2011-07-15",
"lastName": "Rubble",
"lastVisitedDate": "2011-08-10",
"twitterUserId": "barneyLikesTwitter",
"updated_at": "2011-09-15T04:15:17Z",
"dateOfBirth": "2011-06-15",
"middleName": "",
"facebookUserId": "barneyIsCool",
"id": 2,
"userId": "barneyRubble",
"firstName": "Barney",
"description": ""
}
}
]


When I stick this json into something like: http://jsonlint.com/ it is valid even.

Here's my model defined in Model.js



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





I found several threads similair but maybe the json data structure isn't quite exactly right according the json configuration I have for ext.data.Store definition.

Any thoughts? or is this a Rails output issue. This service is working fine with this json structure for another iPhone RestKit api.

Thanks,

Nick

AndreaCammarata
21 Sep 2011, 11:25 AM
Hi.
To solve your error, remove the "root" config param from your store reader, in this way



store: new Ext.data.Store({
model: 'Client',
autoLoad: true,
proxy: {
type: 'ajax',
url : 'http://localhost:3000/clients.json',
reader: {
type: 'json'
}
}
}),


Then, from the server side, send the json data without the "client" node



[
{
"created_at": "2011-09-15T03:56:15Z",
"customerSinceDate": "2007-07-04",
"lastName": "Flintstone",
"lastVisitedDate": "2011-08-06",
"twitterUserId": "IuseStoneForMessagingIf",
"updated_at": "2011-09-15T03:56:15Z",
"dateOfBirth": "2006-09-15",
"middleName": "",
"facebookUserId": "fredIsWayOldForFB",
"id": 1,
"userId": "fredflintstone1",
"firstName": "Fred",
"description": "Freddie flintster"


},{
"created_at": "2011-09-15T04:15:17Z",
"customerSinceDate": "2011-07-15",
"lastName": "Rubble",
"lastVisitedDate": "2011-08-10",
"twitterUserId": "barneyLikesTwitter",
"updated_at": "2011-09-15T04:15:17Z",
"dateOfBirth": "2011-06-15",
"middleName": "",
"facebookUserId": "barneyIsCool",
"id": 2,
"userId": "barneyRubble",
"firstName": "Barney",
"description": ""


}
]


This should solve your problem.
Hope this helps.

nneuberger1
28 Sep 2011, 8:18 PM
Worked great. I made both changes and now returning data on the page! Thanks a ton.

AndreaCammarata
28 Sep 2011, 9:53 PM
Worked great. I made both changes and now returning data on the page! Thanks a ton.

You are welcome!