CODEWITHSUNDEEP
javascriptextjsextjs4extjs4.1
jorel
jorel

Reputation: 808

How to make Ext.button.Cycle to use radio buttons instead of check marks?

ExtJS Cycle button menu contains checked menu items, where we can select only one item at any time (see the attached picture or live example). This is confusing to the users. I want to know if there is any way to configure this Cycle component to show radio buttons instead of checkboxes.

enter image description here

Upvotes: 0

Views: 1073

Answers (2)

Saket Patel
Saket Patel

Reputation: 6683

Ext.menu.CheckItem can be configured to be shown as a radio button, so we want to use it then we have to specify our custom menu with all items as Ext.menu.CheckItem and provide group config in each item to make it radio buttons.

{
    xtype : 'cyclebutton',
    menu : {
        xtype : 'menu',
        items : [{
            xtype : 'menucheckitem',
            text : 'Check 1',
            group : 'check'     // this will make sure that checkboxes will be rendered as group
        },{
            xtype : 'menucheckitem',
            text : 'Check 2',
            group : 'check'     // this should be same for every check item to put it in single group
        }]
    }
}

Upvotes: 1

Jan Korenek
Jan Korenek

Reputation: 214

You can try to set up item xtype as radio

 items: [{
        xtype: 'radio',
        boxLabel  : 'a'            
    },{
        xtype: 'radio',
        boxLabel  : 'b'
    }]

Upvotes: 0

Related Questions