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

ExtJS form with labels and fields on the same line

本文关键字:一行 表单 标签 字段 ExtJS      更新时间:2023-09-26

我正在努力创建一个ExtJS表单与两个标签文本字段。我希望标签和输入字段都出现在同一行上。我编写的代码将文本字段分隔开,在第一行显示标签,在下一行显示输入字段。

我有什么:http://jsfiddle.net/aw2Pr/

修复可能是非常简单的,但我似乎不能弄清楚。这在HTML中是小菜一碟,我的意思是,像这样:

<label>Amount: <input /></label>
<label>Currency: <input /></label>
http://jsfiddle.net/AyqYr/

如何在ExtJS中获得类似的布局?

我已经尝试改变布局,改变与文本字段,分配宽度字段标签,问谷歌…

要实现标签在同一行的字段,通过创建一个水平布局的容器从默认配置中删除样式。

见下面的示例代码:

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'
            }]
        }
    );
});