Question

I have two Ext.menu.CheckItem’s in a group. How would I change the checked item’s disc icon to something else? I would like to retain the radio button functionality (only one selected), but have a check mark instead of the disc.

var options = new Ext.Button({
    allowDepress: false,
    menu: [
        {checked:true,group:'labels',text:'Option 1'},
        {checked:false,group:'labels',text:'Option 2'}
    ]
});

Answer 1

You can achieve that effect (radio controls that look like check boxes) by setting the inputType configuration option to 'checkbox':

var options = new Ext.Button({
    allowDepress: false,
    menu: [
        {inputType:'checkbox',checked:true,group:'labels',text:'Option 1'},
        {inputType:'checkbox',checked:false,group:'labels',text:'Option 2'}
    ]
});

As an example, here are two screenshots that show the effect of inputType:'checkbox':

First screenshot http://www.freeimagehosting.net/uploads/2f662f202c.png

Second screenshot with the "Red" option http://www.freeimagehosting.net/uploads/66c002aad2.png

I modified Ext JS’ Checkbox/Radio Groups demo and only added the option to the “Red” radio component configuration.