PropertiesMethodsEventsConfig OptionsDirect Link

Class Ext.layout.FormLayout

Defined In: FormLayout.js
Class: Ext.layout.FormLayout
Extends: Ext.layout.AnchorLayout

这是用来创建一个表单的布局。 该类可以被继承或通过配置项 layout:'form' Ext.Container#layout 来创建, 而不像通常情况下使用关键字 new 来创建。可是,在应用中,一般我们会选择使用 Ext.form.FormPanel (自动使用 FormLayout 作为布局类),而且它还提供了内建的读取、效验和提交表单的函数。

需要注意的是,当通过配置项来创建布局的时候,布局的属性必须通过 Ext.Container#layoutConfig 对象来指定。使用 FormLayout 布局的容器,也支持以下配置属性:

任意类型的组件都能被添加到 FormLayout 中,但是继承自 Ext.form.Field 的项还支持下列配置项属性:

使用示例:


// 如果要显示效验信息则必需
Ext.QuickTips.init();

// 虽然你也可以创建一个包含 layout:'form' 的 Panel,但是我们建议使用 FormPanel 来代替,因为它自带 FormLayout 布局。
var form = new Ext.form.FormPanel({
    labelWidth: 75,
    title: 'Form Layout',
    bodyStyle:'padding:15px',
    width: 350,
    labelPad: 10,
    defaultType: 'textfield',
    defaults: {
        // 应用于每个被包含的项
        width: 230,
        msgTarget: 'side'
    },
    layoutConfig: {
        // 这里是布局配置项
        labelSeparator: ''
    },
    items: [{
            fieldLabel: 'First Name',
            name: 'first',
            allowBlank: false
        },{
            fieldLabel: 'Last Name',
            name: 'last'
        },{
            fieldLabel: 'Company',
            name: 'company'
        },{
            fieldLabel: 'Email',
            name: 'email',
            vtype:'email'
        }
    ],
    buttons: [{
        text: 'Save'
    },{
        text: 'Cancel'
    }]
});

配置项

配置项 定义者

公告属性

属性 定义者

公共方法

方法 定义者

公告事件

这个类没公共的事件。