Taking Sencha Touch Apps Offline

[jnotti]

I followed the tutorial, "Taking Sencha Touch Apps Offline" and it all works great except for trying to bind my offline store to the menuList. Here is the error I am getting, anyone have a clue as to what I am doing wrong?

Uncaught TypeError: Cannot call method 'bindStore' of undefined:
mApp.menuList.bindStore(mApp.offlineStore);

In my app.js file:

        
        // the data-bound menu list
        var menuList = viewport.menuList = new Ext.List({
            store: mApp.onlineStore,
            itemTpl: '{title}',
            allowDeselect: false,
            singleSelect: true
        });

        // a wrapper around the menu list
        var menu = viewport.menu = new Ext.Panel({
            items: [menuList],
            layout: 'fit',
            width: 320,
            dock: 'left'
        });

And in my data.js file I have:

// remote JSON
Ext.regModel('XPosts', {
    fields: [
        {name: 'id'},
        {name: 'type'},
        {name: 'slug'},
        {name: 'url'},
        {name: 'status'},
        {name: 'title'},
        {name: 'title_plain'},
        {name: 'content'},
        {name: 'excerpt'},
        {name: 'date'},
        {name: 'modified'}
    ]
});

mApp.onlineStore = new Ext.data.Store({
     model: 'XPosts',
     proxy: {
            type: 'scripttag',
            url : 'http://localhost/?json=get_recent_posts',
            reader: new Ext.data.JsonReader({
                root: 'posts'
            }),
            timeout: 100,
            listeners: {
                exception:function () {
                    console.log("onlineStore: failed");
                    mApp.menuList.bindStore(mApp.offlineStore); // This throws an error
                    mApp.offlineStore.load();
                }
            }
        },
        autoLoad: true
});

mApp.offlineStore = new Ext.data.Store({
    model: 'XPosts',
    proxy: {
        type: 'localstorage',
        id: 'appdata',
        reader: new Ext.data.JsonReader({
            root: 'posts'
        })
    },
    autoLoad: true
});

[jnotti]

I think the issue is not binding the store to the menuList but rather, accessing it properly from another file.

Within the launch sequence, menuList has a listener bound to it and it works as you would expect. My issue then becomes how to properly access the menuList. I've tried all the namespaces you would think of, mApp, app, this - of which nothing works.

I realize that there is nothing defined for what I am calling so how do I access it!

Cannot call method 'bindStore' of undefined

[jnotti]

BUMP!

Seriously? No one has any input on this?

[sangampandey]

mApp.menuList.bindStore(mApp.offlineStore);

In my app.js file:
Code:

mApp.menuList = viewport.menuList = new Ext.List({ // mistake was here var menuList
store: mApp.onlineStore,
itemTpl: '{title}',
allowDeselect: false,
singleSelect: true });

var menu = viewport.menu = new Ext.Panel({
items: [menuList],
layout: 'fit',
width: 320,
dock: 'left'});


Copy this and run you will not get any error