Extjs3.2 fieldset 패널 추가 삭제, 버그 해결
4469 단어 ExtJs
extjs 홈페이지에서 같은 문제가 있는 사람을 봤는데 다들 토론한 결과 이게formpanel 레이아웃의 버그입니다. 누군가가 해결 방법을 제시했습니다.
접속 주소
http://www.sencha.com/forum/showthread.php?25479-2.0.1-2.1-Field.destroy()-on-Fields-rendered-by-FormLayout-does-not-clean-up.&p=120171
extjs 3.2에 대한 해결 방법은 다음과 같습니다.
Ext.override(Ext.layout.FormLayout, {
renderItem : function(c, position, target){
if(c && !c.rendered && (c.isFormField || c.fieldLabel) && c.inputType != 'hidden'){
var args = this.getTemplateArgs(c);
if(typeof position == 'number'){
position = target.dom.childNodes[position] || null;
}
if(position){
c.itemCt = this.fieldTpl.insertBefore(position, args, true);
}else{
c.itemCt = this.fieldTpl.append(target, args, true);
}
c.actionMode = 'itemCt';
c.render('x-form-el-'+c.id);
c.container = c.itemCt;
c.actionMode = 'container';
}else {
Ext.layout.FormLayout.superclass.renderItem.apply(this, arguments);
}
}
});
Ext.override(Ext.form.Field, {
getItemCt : function(){
return this.itemCt;
}
});
Ext.layout.FormLayout.prototype.trackLabels = true;
제가 사용한 문제의 js 코드는 다음과 같습니다.
Ext.onReady(function(){
var c = 0;
var testForm = new Ext.form.FormPanel({
name: "form1",
frame:true,
width: 850,
items: [
new Ext.form.FieldSet({
id:'root',
name: 'testFieldSet',
autoHeight: true,
title: 'fieldset',
layout:'column',
isFormField : true,
layoutConfig:{
columns:2
},
collapsible: true,
labelWidth: 60,
items: [{
layout: 'form',
columnWidth:.5,
autoDestroy: true,
items: [{
xtype : "textfield",
name : "testtextvalid",
fieldLabel: "----",
frame:true,
allowBlank: false
}]
}]
}),{
xtype:'button',
text:'test',
handler: function (){
alert( Ext.getCmp('tx'+(c)) );
}
},{
xtype: 'button',
text: 'add',
handler: function (){
c += 1;
var testFieldSet = Ext.getCmp('root');
testFieldSet.add({
id:'te'+c,
columnWidth:.5,
layout: 'form',
autoDestroy: true,
items: [{
id: 'tx'+c,
xtype : "textfield",
name : "testtextvalid",
fieldLabel: "extjs"+c,
frame:true,
allowBlank: false
}]
});
testFieldSet.doLayout();
testForm.doLayout();
testFieldSet.form = testForm.getForm();
}
},{
xtype: 'button',
text: 'del',
handler: function (){
var fieldset = Ext.getCmp('root');
Ext.getCmp('tx'+c).destroy();
Ext.getCmp('te'+c).destroy();
fieldset.doLayout();
testForm.doLayout();
c -= 1;
}
} ,{
xtype: 'button',
text: 'submit',
handler: function (){
if(testForm.getForm().isValid()){
alert("yes");
}else{
alert("no");
}
}
}
]
});
testForm.render(Ext.get('idForm'));
});
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
문자열 길이를 계산하고 중국어로 두 개를 계산합니다.텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.