CODEWITHSUNDEEP
extjs4
Rutwick Gangurde
Rutwick Gangurde

Reputation: 4912

Extjs 4 - Button menu item click

I have a menu for a button, which in turn is set as the tools for a container. I want to handle click on the menu items and not on the button itself. How do I implement it?

Upvotes: 4

Views: 10428

Answers (2)

Kohei Mikami
Kohei Mikami

Reputation: 2870

You can handle all items in a listener through a code below. Pass a menu config to a button and add a click listener to the menu.

{
    xtype: 'button',
    text: 'Button',
    menu: {
        xtype: 'menu',
        items: [
            { text: 'foo' },
            { text: 'bar' },
            { text: 'hoge' }
        ],
        listeners: {
            click: function( menu, item, e, eOpts ) {
                console.log(item.text);
            }
        }
    }
}

Upvotes: 5

Evan Trimboli
Evan Trimboli

Reputation: 30082

Example, should be straight forward:

Ext.onReady(function() {

    new Ext.panel.Panel({
        renderTo: document.body,
        title: 'A Panel',
        width: 200,
        height: 200,
        tools: [{
            xtype: 'button',
            text: 'Foo',
            menu: {
                items: [{
                    text: 'Item 1',
                    handler: function() {
                        console.log('Item 1');
                    }
                }, {
                    text: 'Item 2',
                    handler: function() {
                        console.log('Item 2');
                    }
                }]
            }
        }]
    });
});

Upvotes: 2

Related Questions