gpt4 book ai didi

javascript - 如何在Ext.FormPanel中添加一些元素和网格?

转载 作者:行者123 更新时间:2023-11-28 02:27:13 25 4
gpt4 key购买 nike

我有一个 ExtJs 3.4 应用程序。
我想在 FormPanel 上设置一些字段和网格,我说:

            var searchPan = new Ext.FormPanel({
title:'Поиск',
labelAlign: 'top',
frame:true,
//xtype:'panel',
//layout:'border',
//region: 'center',
split: true,
collapseMode: "mini",
collapsed:false,
items:[{
xtype:'fieldset',
columnWidth: 0.5,
title: 'Поиск объектов',
collapsible: true,
collapsed: true,
autoHeight:true,
defaults: {
anchor: '-20' // leave room for error icon
},
items: [{
xtype:'textfield',
fieldLabel: 'Диспечерское наименование',
name: 'name_dispather',
anchor:'100%',
enableKeyEvents: true,
listeners: {
'keyup': function(e) {
if(e.getValue().length>=4){
var searchFromValues=search.getForm().getValues();
searchStore.load({params:{'name':e.getValue(),'type':searchFromValues.objType,'voltage':searchFromValues.objVolt}});
}
}
}
},{
layout:'column',
//defaults: {/*flex: 1, */layout: 'form',},
items:[{
columnWidth:.5,
layout: 'form',
items: [{
xtype: 'combo',
anchor:'60%',
name:'objType',
fieldLabel: 'Тип Объектов',
store: new Ext.data.SimpleStore({
data: [
[1, 'ВЛ'],
[2, 'ТП']
],
id: 0,
fields: ['value', 'text']
}),
valueField: 'value',
displayField: 'text',
triggerAction: 'all',
lazyRender:true,
mode: 'local',
editable: false
}]
},{
columnWidth:.5,
layout: 'form',
items: [{
xtype: 'combo',
anchor:'60%',
name:'objVolt',
fieldLabel: 'Напряжение',
store: new Ext.data.SimpleStore({
data: [
[1, '04'],
[2, '6'],
[3, '35'],
[4, '110']
],
id: 0,
fields: ['value', 'text']
}),
valueField: 'value',
displayField: 'text',
triggerAction: 'all',
lazyRender:true,
mode: 'local',
editable: false
}]
},searchTab]
}]
}]
});

您看到我想要在表单中拥有一个文本字段、2 个组合框和一个网格。结果:

enter image description here

但我希望组合框将位于网格上方。
我做错了什么?

更新

当我使用布局:像 A1rPun 的答案中那样的表时,我得到:

enter image description here

最佳答案

你做错了几件事。首先尝试最小化嵌套。做这样的事情:

{
xtype: 'form'
items: [{
xtype: 'fieldset',
layout: 'table'
items: [{
xtype:'textfield',
colspan: 2
},{
xtype: 'combobox'
},{
xtype: 'combobox'
}]
}]
},
{
xtype: 'grid'
}

接下来是每个容器的布局。您在没有具有列布局的父级的项目上指定columnWidthHere是一个很好的布局教程。

顺便说一句:在您的代码中找不到网格。

关于javascript - 如何在Ext.FormPanel中添加一些元素和网格?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14751507/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com