Cannot read property 'length' of undefined

[Salim Drame]

Hi!
I have copied this code from the nestedlist video tutorial and modified it a little. I am having this error :

• Uncaught TypeError: Cannot read property 'length' of undefined

Here is my code :

My JSon

{
"items" : [
    {
        "id": 1,
        "name": "Ed Spencer",
        "email": "ed@sencha.com"
    },
    {
        "id": 2,
        "name": "Abe Elias",
       "email": "abe@sencha.com"
    }
]
}

My script

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

listStoreItem = new Ext.data.TreeStore({
    model: 'listItem',
    proxy: {
        type: 'ajax',
        url: '/public/models/contacts.json',
        reader: {
            type: 'tree', //Parceque c'est une NestedList
            root: 'items'
        }
    }
});


Viewport = Ext.extend(Ext.NestedList, {
    fullscreen: true,
    title: "Contacts list",
    store: listStoreItem
})




NestedListDemo = new Ext.Application({
    name: "NestedList",
    
    launch: function() {
        viewport = new Viewport();
    }
});

Can anyone help me with that? Thanks

[mbalsam]

Unless it's a copy/paste typo you should have a closing curly bracket for your json and if you have your json in a file add the file extension:

url: '/public/models/contacts.json'

the property in the proxy's reader should be

root: 'items'

instead of record: 'users'

finally you should have nested data for your nested list. and try to avoid global variables in general.

[Salim Drame]

Sorry for that i've been trying different possibilities and i forgot to put back the root line of code. I've just edited it but i still have the same error though. Other suggestions?

[Salim Drame]

The video has the exact code as below when showing list arguments the first time. I am sorry but i don't understand when you say i should have nested data

NestedListDemo.music_store = new Ext.data.TreeStore({
    model: 'ListItem',
    proxy: {
        type: 'ajax',
        url: '/tracks/catalogue.json',
        reader: {
            type: 'tree',
            root: 'items'
        }
    }
});

[ITS Telco]

Could it be it is a general problem.
Coz I try long time already to store a jsonp object and it will not working.
I already opened a thread for a similar problem:
http://www.sencha.com/forum/showthre...ect-in-a-store
My data are nested data, too and after store command the store object has no data.
In the Sencha touch api abut the reader are some parts of examples, because I though I made something wrong with the regModels.
But i do not know it was not runing ....

[Salim Drame]

Can you suggest me an alternative?

[ITS Telco]

The only way how I could store data was in an array.
Instead of "url" parameter I used the "data" parameter.
But this is non alternative for me, because I get JSON data fom a third system.
Maybe I could convert now the JSON in array.
But it is not a solution, too. It needs time on the client.
In the kitchensink demo JSON data will loaded, but then immediately displayed in an template.
I wondering, why no one else have this kind of problems ...

[mbalsam]

The video has the exact code as below when showing list arguments the first time. I am sorry but i don't understand when you say i should have nested data

NestedListDemo.music_store = new Ext.data.TreeStore({
    model: 'ListItem',
    proxy: {
        type: 'ajax',
        url: '/tracks/catalogue.json',
        reader: {
            type: 'tree',
            root: 'items'
        }
    }
});

Well, the data in your initial post is flat. Your items don't have sub-items and you have not set the leaf property to true on any of them. Look at the data from the API docs:

http://dev.sencha.com/deploy/touch/d...estedList.html

[Salim Drame]

Thanks you guys for your help. After hours of debugging and looking for something else to replace Sencha it works. I've put my data into a variable named 'data' that i call within the NestedList as root attribute like below. I've also added leaf to my data.

var store = new Ext.data.TreeStore({
    model: 'ListItem',
    root: data,
    proxy: {
        type: 'ajax',
        reader: {
            type: 'tree',
            root: 'items'
        }
    }
});