In ExtJS, How Can You Loop Through Menu Items?

Question

How can you loop through all the items in an ExtJS toolbar menu, for example to change their icons?

Answer 1

Use the 'each' method of the MixedCollection instance in the button's menu.

Assuming a definition like:

var pnl = new Ext.Panel({
    tbar: [
        {
            itemId: 'a_btn',
            text: 'A menu button',
            menu: {items: [
                {
                    text: 'Item 1'
                },
                {
                    text: 'Item 2'
                }
            ]}
        }
    ]
});

You can then later do:

var btn = pnl.getTopToolbar().get('a_btn');

btn.menu.items.each(function( item ) {
    item.setIconClass('');
});