EXtjs 下fieldset 与colum整合

 

EXtjs 下fieldset 与colum整合

 

var custInfoPanel = new Ext.FormPanel({
    labelWidth: 75, // label settings here cascade unless overridden
    frame:true,
    items: [{
        xtype:'fieldset',
        title: '基础信息',
        collapsible: true,
        autoHeight:true,
        layout:'form',
        items :[{
            layout:'column',
            items:[{
                columnWidth:.3,
                layout: 'form',
                items: [{
                    xtype:'textfield',
                    fieldLabel: 'First Name',
                    name: 'first',
                    anchor:'95%'
                }, {
                    xtype:'textfield',
                    fieldLabel: 'Company',
                    name: 'company',
                    anchor:'95%'
                }]
            },{
                columnWidth:.3,
                layout: 'form',
                items: [{
                    xtype:'textfield',
                    fieldLabel: 'Last Name',
                    name: 'last',
                    anchor:'95%'
                },{
                    xtype:'textfield',
                    fieldLabel: 'Email',
                    name: 'email',
                    vtype:'email',
                    anchor:'95%'
                }]
            }]
        }]
    }],
    buttons: [{
        text: 'Save'
    },{
        text: 'Cancel'
    }]
});

 效果图如下