Sencha Touch:列出详细信息.setActiveItem undefined

时间:2011-07-17 07:50:01

标签: javascript mobile sencha-touch extjs

我正在整理和应用并试图获得一个详细面板工作的列表。我将它基于Sencha列表视频,但不断收到错误“TypeError:表达式结果'abc.artistList.setActiveItem'[undefined]不是函数。”当我尝试点击某个项目并显示详细信息面板时。完整代码如下:

Ext.ns('abc', 'abc.panel', 'abc.store');

// Models _____________________________________________________________________
Ext.regModel('Artists', {
    fields: ['firstName', 'lastName']
});


// Stores _____________________________________________________________________
abc.store.Artists = new Ext.data.Store({
    model: 'Artists',
    proxy: {
        type: 'ajax',
        url: 'http://localhost:8888/abc/stores/artists.json',
        reader: {
            type: 'json',
             root: 'artists'
        }
    },
    sorters: 'lastName',
    getGroupString : function(record) {
        return record.get('lastName')[0];
    },
    autoLoad: true
});

abc.artistDetail = new Ext.Panel({
            id: 'detailpanel',
            tpl: 'Hello, {firstName}!',
            dockedItems: [
                {
                    xtype: 'toolbar',
                    items: [{
                        text: 'back',
                        ui: 'back',
                        handler: function() {
                            abc.panel.Artists.setActiveItem('artistList', {type:'slide', direction:'right'});
                        }
                    }]
                }
            ]
        });

abc.artistList = new Ext.List({
    title: 'Artists',
    store: abc.store.Artists,
    fullscreen: true,
    id: 'artistList',
    itemTpl: '<div class="contact">{firstName} {lastName}</div>',
    grouped: true,
    onItemDisclosure: function(record, btn, index) {
        abc.artistDetail.update(record.data);
        abc.panel.Artists.setActiveItem('detailpanel');
    }
});

abc.panel.Artists = Ext.extend(Ext.Panel, {
    id: 'artists',
    title: 'Artists',
    layout: 'card',
    fullscreen: true,
    cardSwitchAnimation: 'slide',
    iconCls: 'artists',
    items: [abc.artistList, abc.artistDetail],
});

abcPrimavera = new Ext.Application({
    name: "abcApp",

    onReady: function () {
        var app = new Ext.TabPanel({
            fullscreen: true,
            animation: false,
            tabBar: {
                dock: 'bottom',
                layout: {
                    pack: 'center'
                }
            },
            items: [
            new abc.panel.Artists()]
        });
        }
});

任何帮助都会很棒。

由于

1 个答案:

答案 0 :(得分:0)

Ext.ns('abc', 'abc.panel', 'abc.store');

// Models _____________________________________________________________________
Ext.regModel('Artists', {
    fields: ['firstName', 'lastName']
});


// Stores _____________________________________________________________________
abc.store.Artists = new Ext.data.Store({
    model: 'Artists',
    proxy: {
        type: 'ajax',
        url: 'http://localhost:8888/abc/stores/artists.json',
        reader: {
            type: 'json',
             root: 'artists'
        }
    },
    sorters: 'lastName',
    getGroupString : function(record) {
        return record.get('lastName')[0];
    },
    autoLoad: true
});

abc.artistDetail = new Ext.Panel({
            id: 'detailpanel',
            tpl: 'Hello, {firstName}!',
            dockedItems: [
                {
                    xtype: 'toolbar',
                    items: [{
                        text: 'back',
                        ui: 'back',
                        handler: function() {
                            Ext.getCmp('artists').setActiveItem('artistList', {type:'slide', direction:'right'}); //updated code
                        }
                    }]
                }
            ]
        });

abc.artistList = new Ext.List({
    title: 'Artists',
    store: abc.store.Artists,
    fullscreen: true,
    id: 'artistList',
    itemTpl: '<div class="contact">{firstName} {lastName}</div>',
    grouped: true,
    onItemDisclosure: function(record, btn, index) {
        abc.artistDetail.update(record.data);
        Ext.getCmp('artists').setActiveItem('detailpanel'); //updated code
    }
});

abc.panel.Artists = Ext.extend(Ext.Panel, {
    id: 'artists',
    title: 'Artists',
    layout: 'card',
    fullscreen: true,
    cardSwitchAnimation: 'slide',
    iconCls: 'artists',
    items: [abc.artistList, abc.artistDetail],
});

abcPrimavera = new Ext.Application({
    name: "abcApp",

    onReady: function () {
        var app = new Ext.TabPanel({
            fullscreen: true,
            animation: false,
            tabBar: {
                dock: 'bottom',
                layout: {
                    pack: 'center'
                }
            },
            items: [
            new abc.panel.Artists()]
        });
        }
});

上面更新的代码的两部分 - 使用错误的语法来定义itemDisclosure。