Control problem

[cacko]

Hi

I have a button with itemId : backBtn in card layout, the button is in toolbar which is docked top and is hidden by default, the layout has two panels, first panel is a list of items, when clicked on an item there it redirects to schedule controller which shows the second panel - I can show the button, but for some reason goBack function is never called.

the card layout

Ext.define('App.view.Viewport', {
    extend: 'Ext.Panel',
    config: {
        fullscreen: true,
        layout: 'card',
          masked: {
            xtype: 'loadmask',
            message: 'Please wait..'
        },
        items: [
            {
                xtype: 'toolbar',
                title: 'Vatman (beta)',
                docked: 'top',
                items: [
                    {
                        text: 'Back',
                        itemId: 'backBtn',
                        ui: 'back',
                        hidden: true
                    },
                    {
                        xtype: 'spacer'
                    },
                    {
                        itemId: 'searchBtn',
                        iconCls: 'search',
                        iconMask: true,
                        ui: 'action',
                        hidden: true
                    },
                ]
            },
            { xtype: 'stopsIndex' } ,
            { xtype: 'stopsSchedule' }
        ]
    }
});

part of app.js

Ext.application({
    name : 'App',
    icon : '/images/icon.png',
    fullscreen : true,
    views : ['Viewport', 'stops.Index'],
    models : ['Stops', 'Stop'],
    controllers : ['Schedule'],
    stores : ['Stops', 'Stop'],
    requires : ['Ext.util.Geolocation'],
    launch : function() {
......
        this.viewport = Ext.create('App.view.Viewport');
        Ext.Viewport.add(this.viewport);
        this.viewport.setMasked(false);
    },
});

first panel that triggers the schedule controller on tap

Ext.define('App.view.stops.Index', {    extend : 'Ext.Panel',
    requires : ['Ext.dataview.List'],
    xtype : 'stopsIndex',
    config : {
        scrollable : 'vertical',
        layout : 'fit',
        items : [{
            xtype : 'list',
            scrollable : 'vertical',
            store : 'Stops',
.....
            listeners : {
                itemtap : function(view, idx, item, record) {
                    App.app.redirectTo('schedule/' + record.get('code'));
                }
            },
        }],
    }
});

the schedule controller which is triggered by click on a first panel, it activates the second panel in the card layout, shows the back button, and should trigger goBack function on top on backbutton, but it's never called.

Ext.define('App.controller.Schedule', {
    extend : 'Ext.app.Controller',
    config : {
        views : ['stops.Schedule'],
        routes : {
            'schedule/:rest' : 'schedule',
        },
        control : {
            backBtn : {
                'tap' : 'goBack'
            }
        },
        refs : {
            backBtn : "#backBtn"
        },


    },
    goBack : function() {
        console.log('back');
    },
    schedule : function(stop) {
......
        this.getBackBtn().show();
        App.app.viewport.setActiveItem(1);
    }
});

[cacko]

nevemind, fixed it.

[shihan]

Could you please provide your solution. The sense of a forum should be give and take - even if you did not get an answer