Extjs3.2 fieldset 添加 panel 再删除,bug解决

1 篇文章 0 订阅
1 篇文章 0 订阅
最近公司的一个项目中需要用extjs中的fieldset进行动态的添加、删除元素,结果遇到了这样的bug,当我在fieldset中动态添加一个嵌套panel的textfield属性时,之后我在删除这个panel,这个panel 的dom确实是从 document中删除了,可是在formpanel级别的并没有移除,在formpanel表单验证的时候会报错。
在extjs的官网中 看了有同样问题的人,大家讨论的结果是 这个是formpanel布局的bug,有人给出了解决的 办法,
连接地址[url]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[/url]

对于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'));

});


  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值