extjs 4.2.1 - Radiogroup:添加带文本框的单选按钮

Question

在我的UI中,我有一个单选的RadioGroup,有几个选项可供选择.其中一个选项将包含一个用户可以输入输入的文本字段,如下所示:

() Option A
() Option B
() Other (Please specify) ____

我如何将这样的东西添加到RadioGroup？

Answer 1

要创建"其他"选项的布局,可以使用container带hbox布局的组件.该组件将包含两个项目.第一项将是radio,第二项将是textfield.

用于创建可以使用的组件radio和textfield组件之间的空间splitter.

{
    xtype: 'radiogroup',
    fieldLabel: 'Choose',
    columns: 1,
    vertical: true,
    items: [
        { boxLabel: 'Option 1', name: 'rb', inputValue: '1' },
        { boxLabel: 'Option 2', name: 'rb', inputValue: '2' },
        {
            xtype: 'container',
            layout: 'hbox',
            items: [
                { 
                    xtype: 'radio',
                    boxLabel: 'Other (Please specify)', 
                    name: 'rb', 
                    inputValue: '3' 
                },
                {
                    xtype: 'splitter'
                },                            
                {
                    xtype: 'textfield',
                    name: 'option3detail'

                }
            ]
        }              
    ]
}

摆弄实例:https://fiddle.sencha.com/#fiddle/2kj