ExtJS3.4:如何动态更改字段集大小
我正在尝试将一个项目动态添加到ExtJS3.4:如何动态更改字段集大小,extjs,dynamic,extjs3,fieldset,Extjs,Dynamic,Extjs3,Fieldset,我正在尝试将一个项目动态添加到fielset中。我已在控制台中检查了字段集的项目,该项目正在添加到字段集,但没有显示,我正在调用字段集的doLayout()方法,以及具有此字段集的formpanel,但字段集的大小/高度没有改变。有人能帮我解决这个问题吗 if(csType.value=="OS"){ Ext.apply(newOs,that.osCombo); newOs.id = 'testOs2'; Ext.getC
fielset
中。我已在控制台中检查了字段集的项目,该项目正在添加到字段集,但没有显示,我正在调用字段集的doLayout()
方法,以及具有此字段集的formpanel
,但字段集的大小/高度没有改变。有人能帮我解决这个问题吗
if(csType.value=="OS"){
Ext.apply(newOs,that.osCombo);
newOs.id = 'testOs2';
Ext.getCmp('cSFieldSet').add(newOs);
Ext.getCmp('cSFieldSet').setHeight(600);
Ext.getCmp('cSFieldSet').doLayout(true,true);
Ext.getCmp('cSFieldSet').ownerCt.doLayout(true,true);
that.csFormPanel.doLayout(true,true);
}
我还尝试使用了
autoHeight:true
,但仍然没有显示该项目以下是我刚刚编写的一些测试代码,以模拟您试图实现的目标:
var simple = new Ext.FormPanel({
labelWidth: 75,
frame:true,
title: 'Simple Form',
bodyStyle:'padding:5px 5px 0',
width: 350,
defaults: {width: 230},
defaultType: 'textfield',
items: [{
// Fieldset in Column 1
xtype:'fieldset',
itemId: 'fieldSetTest',
columnWidth: 0.5,
title: 'Fieldset 1',
collapsible: false,
autoHeight:false,
defaultType: 'textfield',
items :[{
fieldLabel: 'Field 1'
}, {
fieldLabel: 'Field 2'
}, {
fieldLabel: 'Field 3'
}
]
}
],
buttons: [{
text: 'Add New Field',
handler: function() {
var newItem = new Ext.form.TextField({fieldLabel: 'New Fields'});
simple.getComponent('fieldSetTest').add(newItem);
simple.doLayout();
},
scope:this
}]
});
simple.render(document.body);
});
这可以正常工作,因此单击“添加”按钮,新项目将显示在字段集中,字段集的高度将自动增加。如果看不到您的整个formpanel代码,我无法进一步评论。您能发布您的formpanel代码tooThanks吗..效果很好,。但是如何移除组件呢?我尝试了这样的
simple.getComponent('fieldSetTest').remove(newItem)代码>和它work@Shruti尝试fieldset.remove(Ext.getCmp('componentIdToRemove'))
不确定Ext.getCmp
是否存在于3.4中,但请使用任何允许您获取ExtJS组件句柄的方法。如果您在每个字段集项上设置了itemId,则可以执行fieldset.remove(fieldset.getComponent('itemIdhere'))。您甚至可以执行fieldset.getComponent('itemIdHere').destroy()