Button click not detected

Question

I have a Window, and it contains some textfields and a button. Here's the definition of the button; alias.widget:'mywin', ....

            {
                xtype: 'button',
                height: 40,
                width: 110,
                text: 'send',
                x: 58,
                y: 12,
                action: 'buttonclick'
            },

In my controller, i am going to detect this button click and display a console.log statement.

here's the code ;

init: function(application) { this.control({

        'mywin button[action=buttonclick]': {
            click: this.butClick
        }
    });
},


butClick: function(button,record) {
    console.log('Button clicked');

This is not getting displayed, and how can i solve it ?

UPDATE

Ext.define('MyApp.view.MyWindowClass', {
    extend: 'Ext.window.Window',
    alias: 'widget.mywin',
    height: 340,
    id: 'mywinid',
    width: 728,
    layout: {
        type: 'absolute'
    },

    initComponent: function() {
        var me = this;

        Ext.applyIf(me, {
            items: [

                {
                    xtype: 'textareafield',
                    height: 140,
                    width: 340,
                    fieldLabel: 'Name',
                    x: 370,
                    y: 80
                },
                {
                    xtype: 'button',
                    height: 40,
                    width: 210,
                    text: 'Save',
                    x: 480,
                    y: 240,
                    action: 'submitfeedback'
                },
                {
                    xtype: 'datefield',
                    id: 'dd',
                    readOnly: true,
                    fieldLabel: 'Today',
                    x: 10                  
                }
            ],
            listeners: {
                show: {
                    fn: me.onWindowShow,
                    scope: me
                }
            }
        });
        me.callParent(arguments);
    }
});

CONTROLLER

Ext.define('MyApp.controller.MyController', {
    extend: 'Ext.app.Controller',
    models: [
        'MyController'
    ],
    stores: [
        'MyController'
    ],
    views: [
        'MyWindowClass',        
    ],
    init: function(application) {
        this.control({
            'mywin button[action=submitfeedback]': {
                click: this.butClick
            }
        });
    },
    butClick: function(button,record) {
        console.log('button clicked');
        });
    }
});

Answer 1

Two possibilities:

1. This is probably a typo, but you wrote alias.widget: 'mywin'. This should be alias: 'widget.mywin'

2. The controller might not be loaded. Put a break point at the beginning of the init function to see if it gets run.

Other than that, your code looks correct. If you post some more context (e.g. how you are creating the window, loading the controller, a full definition of mywin) I can examine it further.

Edit

Your capitalization is wrong in the selector. myWin should be mywin.

Answer 2

You have the listener set up correctly except for adding the [action=buttonclick] part. Here are the docs for this.

'mywin button': { // this line determines what view object you want to listen to
    click: this.butClick // this line determines what event you want to listen to
}