Обработчики событий sencha не работают

Question

Я создал навигацию, где контейнер, имеющий две панели; один для добавления панелей одна за другой, а другой в качестве нижнего колонтитула, который содержит кнопки NEXT и BACK. Панели создаются отдельно.

Когда панели добавляются "на лету", используя xtype из них, обработчики событий работают хорошо один раз, но переход назад к обработчикам событий не отвечает (функция viewSettingSelectionPanel). Обработчики событий находятся в главном контроллере.

Я обнаружил, что это поможет использовать itemId вместо Id в панелях (поскольку в нем регистрируются два компонента с одинаковым идентификатором и конфликтующими), но как я могу ссылаться на них в контроллере в этом сценарии?

Пожалуйста, помогите мне понять эту проблему и решение.

Заранее спасибо.

--- мое приложение ---

var current = 0;
var myPanel = new Array("panelOne", "panelTwo", "panelThree", "panelFour", "panelFive");

Ext.define("myApp.controller.MainController", {
    extend: "Ext.app.Controller",

    config: {
        refs: {
            backButton: '#backButton',
            nextButton: '#nextButton',
            panelArea: '#panelArea',
            main: '#main',
            panelOne: '#panelOne',
            panelTwo: '#panelTwo',
            panelThree: '#panelThree',
            panelFourP: '#panelFour',
            panelFiveP: '#panelFiveP',
            footer: '#footer',
            settingSelectionPanel: '#settingSelectionPanel',
            selectSettingTextField: '#selectSettingTextField',
        },

        control: {
            backButton: {
                tap: 'navigateBack'
            },
            nextButton: {
                tap: 'navigateNext'
            },
            selectSettingTextField: {
                focus: 'viewSettingSelectionPanel'
            },
        },
    },

    navigateBack: function() {
        current = current - 1;
        this.addPanel(myPanel[current]);
    },

    navigateNext: function() {
        current = current + 1;
        this.addPanel(myPanel[current]);
    },

    addPanel: function(newPanel) {
        this.getPanelArea().removeAt(0);
        this.getPanelArea().add({
            xtype: "" + newPanel + ""
        });
    },

    viewSettingSelectionPanel: function(input) {
        this.getSelectSettingTextField().disable();
        this.getSettingSelectionPanel().showBy(input);
        this.getSelectSettingTextField().enable();
    }
});