标签和字段在同一行的ExtJS表单

xqkwcwgp  于 2022-11-04  发布在  其他
关注(0)|答案(1)|浏览(163)

我正在努力创建一个带有两个标签文本字段的ExtJS表单。我希望标签和输入字段都出现在同一行。我所编写的代码将文本字段分隔开,标签显示在第一行,输入字段显示在下一行。
我有什么:http://jsfiddle.net/aw2Pr/
修复可能非常简单,但我似乎无法理解。这在HTML中是小菜一碟,我的意思是,像这样:

<label>Amount: <input /></label>
<label>Currency: <input /></label>

http://jsfiddle.net/AyqYr/
如何在ExtJS中获得类似的布局?
我已经试过改变布局,改变文本字段的宽度,给字段标签分配宽度,问谷歌......到目前为止没有帮助。

jyztefdp

jyztefdp1#

要使字段与标签位于同一行,请通过创建一个具有水平布局的容器来从默认配置中删除样式。
请参阅下面的示例代码:

Ext.onReady(function() {    
    var addUserForm = Ext.create(
        'Ext.container.Container',
        {
            renderTo: Ext.getBody(),
            layout: {
                type: 'hbox'
            },
            anchor: '100%',
            defaults: {
                width: 200,
                xtype: 'textfield'
            },
            items: [{
                name: 'amount',
                fieldLabel: 'Amount'
            },{
                name: 'currency',
                fieldLabel: 'Currency'
            }]
        }
    );
});

相关问题