1 
var dr = Ext.create('Ext.FormPanel', {
    frame: true,
    //title: 'Date Range',
    bodyPadding: '5px 5px 0',
    width: 650,
    fieldDefaults: {
        labelWidth: 125,
        msgTarget: 'side',
        autoFitErrors: false
    },
    defaults: {
        width: 300
    },
    defaultType: 'datefield',
    items: [{
        fieldLabel: 'Start Date',
        name: 'startdt',
        id: 'startdt',
        vtype: 'daterange',
        endDateField: 'enddt' // id of the end date field
    }, {
        fieldLabel: 'End Date',
        name: 'enddt',
        id: 'enddt',
        vtype: 'daterange',
        startDateField: 'startdt' // id of the start date field
    }, {
        xtype: 'combobox',
        fieldLabel: 'Vehicle',
        name: 'state11212',
        store: cmbstore,
        valueField: 'DeviceID',
        displayField: 'VehicleNo',
        typeAhead: true,
        queryMode: 'local',
        emptyText: 'Select a Vehicle...'
    }]
});

此代码将有 3 行，
第一行是开始日期字段
第二行是结束日期字段
第三行是组合框。

问题

如何使第一行变成两列，第二列的结束日期字段，平均结束日期字段在开始日期字段的右侧？

4

1 回答 1

1

您可以使用hbox 布局( layout: 'hbox')：

在 Container 中水平排列项目的布局。此布局可以选择在包含数字 flex 配置的子项之间划分可用的水平空间。

工作示例：http: //jsfiddle.net/nue7j/

于 2013-02-14T20:10:07.470 回答