I've got a panel which button shows this window:
MyClass.window.Test = function (config) {
config = config || {};
Ext.applyIf(config, {
title: 'Test',
width: '1000',
autoHeight: true,
fields: [
{
xtype: 'panel',
items: [{
layout: 'form',
items: [
{
xtype: 'textfield',
name: 'testfield',
fieldLabel: 'Test Label Textfield',
id: 'testfield',
emptyText: 'text',
allowBlank: true,
anchor:'95%'
}
]
},
]}
],
url: MyClass.config.connector_url,
action: 'mgr/myext/create',
});
MyClass.window.Test.superclass.constructor.call(this, config);
};
Ext.extend(MyClass.window.Test, MODx.Window);
Ext.reg('test-window', MyClass.window.Test, MODx.Window);
the button itself is like this
{
xtype: 'button',
text: 'TEST',
cls: 'primary-button',
handler: function () {
MODx.load({
xtype: 'test-window',
listeners: {
success: {
fn: function () {
this.refresh();
}, scope: this
}
}
}).show();
}
}
Problem. When I click on the button for the first time, the form displays correctlly. When I click for the second time, textfield disappears and fieldLabel duplicates 4 times (1 click normall 2 click and more - crash). If I replace textfield with any other xtype - everything works well. If remove id it works well(!!!). But I need id for Ext.getCmp. I don't understand why everything is good at the first time, but when I click again it doesn't show correctly. I couldn't find the similar problem anywhere, and was frustrated. Any manipulations with fieldlabel, layuot properties don't help. Where can be the problem? In working version I have around 40 textfield.
The window is not destroyed on close by default, so you have two elements with the same id creating the window again.
this.ident = config.ident || 'mywindow' + Ext.id();
at the start of the window code after
config = config || {};
and later on using
id: 'textfield' + this.ident
will help to bypass that issue.