Add custom item to radio button in extjs

Question

I have this radio button group in extjs

{
    xtype: 'radiogroup',
    flex: 8,
    vertical: true,
    columns: 1,
    labelWidth: 50,
    id: 'radio_group_id',
    fieldLabel: 'Group Label',
    items: [{
        boxLabel: 'option 1',
        name: 'rb-auto',
        inputValue: 1,
        checked: true
    }, {
        boxLabel: 'option 2',
        name: 'rb-auto',
        inputValue: 2
    }, {
        boxLabel: 'option 3',
        name: 'rb-auto',
        inputValue: 3,
        // is this somehow possible
        items:[{
            xtype:'numberfield',
            // number field settings
        }]
    }, {
        boxLabel: 'option 4',
        name: 'rb-auto',
        inputValue: 4
    }, {
        boxLabel: 'option 5',
        name: 'rb-auto',
        inputValue: 5
    }]
},

Is it somehow possible to add number field next to option 3 so that it gets enabled when I select radio button 3?

Or I have to use seaprate containers to align separate number field with the option 3?

Answer 1

You can for example render NumberField into boxLabelEl of radio button. Another way is to create two column layout and in 2nd column put labels and numberfield.

Example of first approach: http://jsfiddle.net/NsbyD/2/