Question

[SOLVED]

I am following this tutorial link

I have a buttons in my Main view like so

Ext.define('Sencha.view.Main', {
    extend: 'Ext.Panel',

    config: {
        items:[
            {
                text:'hello',
                xtype:'button',
                action:'pingHomeBadge',
            }
        ]
    }
});

And my main controller looks like

    Ext.define('Sencha.controller.Main', {
    extend: 'Ext.app.Controller',

    config: {
        refs: {
            starButton:'button[action=pingHomeBadge]',
        },
        control: {
            starButton: {
                tap:'incrementHomeBadge',
            },
        }
    },

    incrementHomeBadge: function() {
        alert("hello");
    },
});

The button gets displayed but when I click on the button nothing happens. Anybody know what I am doing wrong? I pretty much copy pasted the code from the tutorial. Thanks

Answer 1

I suggest you try this way:

Ext.define('Sencha.controller.Main', {
extend: 'Ext.app.Controller',

config: {
    refs: {
       // starButton:'button[action=pingHomeBadge]',
    },
    control: {
        'button[action=pingHomeBadge]': {
            tap:'incrementHomeBadge',
        },
    }
},

incrementHomeBadge: function() {
    alert("hello");
},

});

Also check whether this controller is getting loaded or not. As in mentioned in the app.js