javascript - 如何在 extjs 中的字段之后添加表单提交按钮

Question

添加所有表单字段后如何添加按钮？我知道我可以添加buttons配置为Ext.form.Panel. 但它在停靠栏上添加了按钮。对我来说，这个停靠栏位于屏幕的最低部分。所以我想在项目之后添加它。这是我传递给itemsconfig 选项的配置对象Ext.form.Panel。

        items: [
           // other fields here
        , {
            xtype: 'panel',
            frame: true,
            layout: {
                type: 'hbox',
                pack: 'end'
            },
            items:[{
                text: 'Change',
                xtype: 'button'
            }]
         }

输出是

但我希望按钮与上面的文本字段对齐。

我怎样才能做到这一点？

我正在使用 ExtJS 4.0.7。我不能更新这个版本，因为项目很大而且很复杂。

Answer 1

Ext.form.Panel 有一个 buttonAlign 属性：http ://docs.sencha.com/extjs/4.0.7/#!/api/Ext.form.Panel-cfg-buttonAlign 你可以添加一个 xtype: 'button'在 FormPanel 项目中并对其进行配置：http: //jsfiddle.net/Un5rW/

如果要在另一个面板中添加按钮，则不要将面板布局的“pack”属性设置为 end：

...
layout: {
    type: 'hbox'//,
    //pack: 'end' <----
}

jsfiddle：http: //jsfiddle.net/Un5rW/1/

UPD

表单字段结束按钮对齐的另一个示例：http: //jsfiddle.net/Un5rW/2/