MVC Panel Click event

[arvindwill]

Is it possible to attach the click event handler for a panel body using Ext.app.Controller.control() . Tried by firing the event in the panel

listeners: {
                    click : {
                        fn: function(e, t) {
                             this.fireEvent('click', t);
                        },
                        element: 'el',
                        scope: this
                    }
                }

but even then cant able to catch the handler function corresponding to it in the control() method.

        this.control(
            {
                '[cls~=entity_draw]':{
                    click:this.drawPanel,
                    scope:this
                }
            });

to the panel bodyCls and the cls added entity_draw.

[mitchellsimoens]

The component doesn't have a click event but the element does.

[arvindwill]

simoens but the class is provided in bodyCls only and when inspected the html the class was correctly present in the div even then below code is not working.

'[class~=entity_draw]':{
                	click:this.drawBoardEntity,
                	scope:this
                }

code by which panel is created

 var panel = Ext.create('Ext.panel.Panel', {
	            width: 200,
	            height: 100,
	            floating: true,
	            draggable: true,
	            renderTo:Ext.get('sworkspace'),
	            html: displayString,
	            bodyCls:'entity_draw'
	        });

[arvindwill]

what is the exact equivalent code for mvc style panel click listener.

[vietits]

Try this:

1. View code

Ext.define('App.view.Panel', {
    extend: 'Ext.panel.Panel',
    alias: 'widget.apppanel',
    bodyCls: 'entity_draw',
    ...
    listeners: {
        click: {
            element: 'el',
            fn: function(){
                var panel = Ext.getCmp(this.id);
                panel.fireEvent('click'); // fire 'click' event from panel
            }
        }
    }
});

2. Controller

...
init: function(){
    this.control({
        'apppanel': { // 'panel[bodyCls=entity_draw]'
            click: function(){
                console.log('panel is clicked');
            }
        }
    });
}