Навигация с помощью кнопки в sencha touch

Я делаю первые шаги с Сенча. Результаты - это то, что я получаю после этого, но есть борьба за то, как сэнча собирается. Я медленно вычисляю это, но иногда, как работает код, это немного WTF.

Я пытаюсь создать очень простое приложение, которое делает следующее.

1) Имеет три вкладки, Поиск поблизости (гео), Быстрый поиск по ключевым словам, Поиск по категориям.
2) Каждый поиск по вкладкам возвращает список результатов
3) Каждая из строк - это щелчок, который может отображать немного больше информации.

Я понял, что вкладки в порядке, я думаю.

Так же:

Ext.setup({
    tabletStartupScreen: 'tablet_startup.png',
    phoneStartupScreen: 'phone_startup.png',
    icon: 'icon.png',
    glossOnIcon: false,
    onReady: function() {

                var location = new Ext.Container({
            iconCls: 'search', 
            title: 'Location Search',
            items: [new Ext.Component({
                html: '<img src="images/gfb.gif" />'
            })]
        });

        var quick = new Ext.Container({
            iconCls: 'search', 
            title: 'Quick Search',
            scroll: 'vertical',
            items: [new Ext.Component({
                html: '<img src="images/gfb.gif" />'
            })]
        });

        var category = new Ext.Component({
            iconCls: 'search', 
            title: 'Category Search',
            html: '<img src="images/gfb.gif" /><p>Category</p>'
        });
        var tabpanel = new Ext.TabPanel({
            fullscreen: true,
            tabBar: {
                dock: 'bottom',
                scroll: 'horizontal',
                sortable: false,
                layout: {
                    pack: 'center'
                }
            },
            cls: 'card1',
            items: [
                location,
                quick,
                category
            ]
        });
    }
});

Это отлично работает. Никакой разницы между вкладками, которые я знаю, но я строю до этого...

Правильно, первое, на что я хочу работать, - это вкладка поиска по ключевым словам, поскольку это самый простой тест для этого приложения.

Итак, я добавляю форму.

var quickFormBase = {
                url: "../quicksearch.php?output=json",
                items: [{
                   xtype: 'fieldset',
                   instructions: 'The keyword search is great if you know the name of the company you are looking for, or the particular service you need to find.<p><br />To narrow it down to an area include the town or county name in your query</p>',
                   defaults: {
                       required: false,
                       labelAlign: 'left'
                   },
                   items: [{
                           xtype: 'textfield',
                           label: 'Search',
                           name : 'inpquery',
                           showClear: true,
                           autoCapitalize : false
                       }]
            }],
            listeners : {
                submit : function(form, result){
            console.log('results', result.SearchResults.MainResults.Advert);
                },
                exception : function(form, result){
                    console.log('failure', Ext.toArray(arguments));
                }
            }
    };

var quickForm = new Ext.form.FormPanel(quickFormBase);

Итак, моя конфигурация быстрой вкладки теперь выглядит так:

var quick = new Ext.Container({
            iconCls: 'search', 
            title: 'Quick Search',
            scroll: 'vertical',
            items: [new Ext.Component({
                html: '<img src="images/gfb.gif" />'
            }),quickForm]
});

Теперь у меня есть форма, которая точно выглядит так, как я хочу, и подключился к моему поиску json и возвратил рекламные объявления на консоль. Отлично!

Теперь я хочу создать представление списка, которое имеет верхнюю панель с кнопкой "Назад". Я уверен, что это не способ установить это, но я действительно пытаюсь найти примеры того, как это сделать, поскольку пример с источником имеет сложную настройку, а простые не делают то, что я делаю после.

Теперь я добавляю конфигурацию модели вверху моего файла index.js, чтобы определить мою модель объявления

Ext.regModel('Advert',{
    fields: [
             {name: 'advertid', type:'int'},
             {name: 'Clientname', type:'string'},
             {name: 'telephone', type:'string'},
             {name: 'mobile', type:'string'},
             {name: 'fax', type:'string'},
             {name: 'url', type:'string'},
             {name: 'email', type:'string'},
             {name: 'additionalinfo', type:'string'},
             {name: 'address1', type:'string'},
             {name: 'address2', type:'string'},
             {name: 'address3', type:'string'},
             {name: 'postcode', type:'string'},
             {name: 'city', type:'string'},
             {name: 'Countyname', type:'string'},
             {name: 'longitude', type:'string'},
             {name: 'latitude', type:'string'}
    ]
});

В моей форме прослушиватель успеваемости я делаю следующее:

listeners : {
                submit : function(form, result){

                    var quickstore = new Ext.data.JsonStore({
                        model  : 'Advert',
                        data : result.SearchResults.MainResults.Advert
                    });

                    var listConfig = {
                            tpl: '<tpl for="."><div class="advert">{Clientname}</div></tpl>',
                            scope: this,
                            itemSelector: 'div.advert',
                            singleSelect: true,
                            store: quickstore,
                            dockedItems: [
                                            {
                                                xtype: 'toolbar',
                                                dock: 'top',
                                                items: [
                                                    {
                                                        text: 'Back',
                                                        ui: 'back',
                                                        handler: function(){
                                                            //Do some magic and make it go back, ta!
                                                        }
                                                    }
                                                ]
                                            }
                                        ]
                    };
                    var list = new Ext.List(Ext.apply(listConfig, {
                        fullscreen: true
                    }));
                },
                exception : function(form, result){
                    console.log('failure', Ext.toArray(arguments));
                }
        }

Это работает, однако, он не скользит, как я бы хотел, так же, как при нажатии значков в нижней панели вкладок.

Теперь это то место, где я падаю, я не могу понять, как я делаю заднюю кнопку, чтобы вернуть меня к поиску ключевых слов.

Я нашел setCard и setActiveItem, но я не могу получить доступ к тем из контекста "this" в функции прослушивателя результатов.

Может кто-нибудь дать простой пример того, как это сделать?