ExtJS 4.0.7 fieldcontainer vbox布局

Question

我想在“extjs”中创建一个表单，我想使用“vbox layout”，这样我就可以将textfield和一个按钮放在同一行但不能这样做请尽快帮助我???

以下是我用来创建表单的代码：

[{ formitems :{[xtype:'dsqfieldcontainer'
                layout: {
                           type: 'vbox'
                        },
               items:[{mapping:'ChannelURL',
                       name:'ChannelURL',
                       fieldLabel:'Channel URL',
                       xtype:'dsqtextfield'
                      },
                      {mapping:'Look_Up_ChannelID',
                        name:'Look_Up_ChannelID',
                        fieldLabel:'Look_Up_ChannelID',
                        xtype:dsqbutton
                       }
                      ]
                 ] },
                   {
                     mapping:'CHANNELNAME',
                     name:'CHANNELNAME',
                     fieldLabel:'Channel Name',
                     xtype:'dsqtextfield'
                    },
                    {
                      mapping:'CHANNELID',
                      name:'CHANNELID',
                      fieldLabel:'Channel ID',
                      xtype:'dsqtextfield'
                    },
                    {
                      mapping:'REFRESHTOKEN',
                      name:'REFRESHTOKEN',
                      fieldLabel:'Refresh Token',
                      xtype:'dsqtextfield'
                    }
 }]

Answer 1

尝试：

layout: {
    type: 'table'
}

Answer 2

只需查看下面的代码，您就会明白错误。在我的代码中，文本框和按钮由hbox布局显示在一行中。只需检查一下，如果您遇到任何问题，请告诉我。我的小提琴帐号不起作用。这就是为什么我不能给你链接。

我的例子 -

 Ext.create('Ext.window.Window', {
            height: 400,
            width: 400,
            items: [
                {
                    xtype:'fieldcontainer',
                    layout: {
                        type: 'hbox'
                    },
                    items:[{
                       mapping:'ChannelURL',
                       name:'ChannelURL',
                       fieldLabel:'Channel URL',
                       xtype:'textfield'
                    },
                    {
                        mapping:'Look_Up_ChannelID',
                        name:'Look_Up_ChannelID',
                        xtype:'button',
                       text: 'Button Name'
                    }]
                }]
        }).show();

示例中的更改 -

items:[
                    {
                    xtype: 'fieldcontainer',
                    layout: {
                        type: 'hbox'
                    },
                    items: [{
                        mapping: 'ChannelURL',
                        name: 'ChannelURL',
                        fieldLabel: 'Channel URL',
                        xtype: 'textfield'
                    }, {
                        mapping: 'Look_Up_ChannelID',
                        name: 'Look_Up_ChannelID',
                        xtype: 'button',
                        text: 'Button Name'
                    }]
                    },
                    {
                        mapping: 'CHANNELNAME',
                        name: 'CHANNELNAME',
                        fieldLabel: 'Channel Name',
                        xtype: 'textfield'
                    }, {
                        mapping: 'CHANNELID',
                        name: 'CHANNELID',
                        fieldLabel: 'Channel ID',
                        xtype: 'textfield'
                    }, {
                        mapping: 'REFRESHTOKEN',
                        name: 'REFRESHTOKEN',
                        fieldLabel: 'Refresh Token',
                        xtype: 'textfield'
                    }
                ]