Переход от одного вида к другому с помощью сенсорного экрана

Я новичок в сенча-тач, и мне трудно переходить из одного представления в другое, когда я нажимаю кнопку «Добавить» в своем основном представлении в своем практическом приложении. Я пытался найти ошибки на панели консоли, но Chrome просто показывает и пуст. приставка. Извините, если это похоже на нубский запрос, но любая помощь будет принята с благодарностью.

MainView.js

Ext.define('MyApp.view.MainView', {
    extend: 'Ext.navigation.View',

    requires: [
        'Ext.navigation.Bar',
        'Ext.Button'
    ],

    config: {
        itemId: 'MainView',
        navigationBar: {
            docked: 'top',
            itemId: 'navbar',
            items: [
                {
                    xtype: 'button',
                    align: 'right',
                    itemId: 'addButton',
                    iconAlign: 'center',
                    iconCls: 'add'
                }
            ]
        }
    }

});

AddForm.js

Ext.define('MyApp.view.AddForm', {
    extend: 'Ext.form.Panel',

    requires: [
        'Ext.form.FieldSet',
        'Ext.field.DatePicker',
        'Ext.picker.Date',
        'Ext.Button'
    ],

    config: {
        items: [
            {
                xtype: 'fieldset',
                itemId: 'myForm',
                title: 'Insert Data',
                items: [
                    {
                        xtype: 'textfield',
                        label: 'ID',
                        name: 'id',
                        required: true
                    },
                    {
                        xtype: 'textfield',
                        label: 'Name',
                        name: 'username',
                        required: true,
                        autoCapitalize: true
                    },
                    {
                        xtype: 'datepickerfield',
                        label: 'Date Of Birth',
                        labelWrap: true,
                        placeHolder: 'mm/dd/yyyy'
                    }
                ]
            },
            {
                xtype: 'button',
                itemId: 'saveButton',
                margin: 10,
                ui: 'confirm',
                text: 'SAVE'
            },
            {
                xtype: 'button',
                itemId: 'declineButton',
                margin: 10,
                ui: 'decline',
                text: 'DELETE'
            }
        ]
    }

});

FirstControl.js(контроллер)

Ext.define('MyApp.controller.FirstControl', {
    extend: 'Ext.app.Controller',

    config: {
        refs: {
            MainView: 'mainview',
            addButton: 'mainview #addButton'
        },

        control: {
            "mainview #addButton": {
                tap: 'add'
            }
        }
    },

    add: function(button, e, eOpts) {
        console.log('inside the add function');
        this.getMainView().push({
            xtype:'AddForm',
            title:'Insert'
        });
    }

});