How do I change the radio button icon in extjs?

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':

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