Question

extjs中 如何两列布局表单？ 在线等

//window 窗体
var addDeptWindow = new Ext.Window( {
layout : 'fit',
width : 700,
height : 500,
resizable : false,
draggable : true,
closable : true,
modal : true,
closeAction : 'hide',
title : '<span class="commoncss">新增部门</span>',
items : [ addDeptFormPanel ],
});
//表单内容 因为有非常多的表单内容，现在打算分2行显示 应该是用column布局
//这里简单的写了4个表单内容，两行两列 其实是很多的 不怎么会用column布局 求布局
var addDeptFormPanel = new Ext.form.FormPanel( {
id : 'addDeptFormPanel',
name : 'addDeptFormPanel',
defaultType : 'textfield',
labelAlign : 'right',
labelWidth : 70,
frame : false,
bodyStyle : 'padding:5 5 0',
items : [ {
fieldLabel : '部门名称',
name : 'deptname',
id : 'deptname',
anchor : '99%'
}, {
fieldLabel : '业务对照码',
name : 'customid',
anchor : '99%'
}, {
fieldLabel : '排序号',
name : 'sortno',
anchor : '99%'
}, {
fieldLabel : '备注',
name : 'remark',
anchor : '99%'
} ]
});

Answer 1

你这种情况不应该使用column来布局，column是一种自适应的布局，应该使用table或者hbox布局，拿table做例子，会更适合你这情况：

var form = Ext.create('Ext.form.Panel',{
    layout: {
        type: 'table',
        columns: 2, //每行有几列
        //默认样式
        tableAttrs: {
            style: "width:100;height:40;"
        }
    },
    initComponent: function() {
        var me = this;

        Ext.applyIf(me, {
            items: [
                {
                    xtype: 'numberfield',
                    name:'1',
                    colspan: 1  //表示占用几列
                }，
                {
                    xtype: 'numberfield',
                    name:'2',
                    colspan: 1  
                }
                //.........
            ]
        });

        me.callParent(arguments);
    }
})

Answer 2

外围使用hbox 先分为两列。。VBOX

Answer 3

fieldcontainer，ext官方例子里有