PDA

View Full Version : 3.0 Bad documentation for Ext.Window Events ?



gaetan
18 Sep 2009, 4:28 AM
Hi,
Using the Ext 3.0.0 example hello.js it seems that some events are not fired.



/*!
* Ext JS Library 3.0.0
* Copyright(c) 2006-2009 Ext JS, LLC
* [email protected]
* http://www.extjs.com/license
*/
Ext.onReady(function(){

var win;

var button = Ext.get('show-btn');



button.on('click', function(){

// create the window on the first click and reuse on subsequent clicks

if(!win){

win = new Ext.Window({

applyTo:'hello-win',

layout:'fit',

width:500,

height:300,

closeAction:'hide',

plain: true,



items: new Ext.TabPanel({

applyTo: 'hello-tabs',

autoTabs:true,

activeTab:0,

deferredRender:false,

border:false

}),



buttons: [{

text:'Submit',

disabled:true

},{

text: 'Close',

handler: function(){

win.hide();

}

}]

});

// Work

//win.on("show", function(c) { alert("show"); });

//win.on("afterlayout", function(c, l) { alert("afterlayout"); });

//win.on("resize", function(c) { alert("resize"); });

// Doesn't work

win.on("afterrender", function(c) { alert("afterrender"); });

win.on("render", function(c) { alert("render"); });

}

win.show(this);

});

});

Animal
18 Sep 2009, 4:33 AM
You've used applyTo so it won't be rendered.

You've told it that the DOM structure already exists in the form of element id "hello-win"

Condor
18 Sep 2009, 4:42 AM
Not completely correct.

The window will be rendered, even with 'applyTo', but it will be rendered immediately, so the render and afterrender events have already fired before you attached the listeners.

carol.ext
18 Sep 2009, 8:32 AM
By the time you add those listeners the event has already fired. If you need those, add them to listeners config (example added to your code in red although I don't recomment alerts for debugging).



Ext.onReady(function () {
var win;
var button = Ext.get('show-btn');
button.on('click', function () { // create the window on the first click and reuse on subsequent clicks
if (!win) {
win = new Ext.Window({
applyTo: 'hello-win',
layout: 'fit',
width: 500,
height: 300,
closeAction: 'hide',
plain: true,
items: new Ext.TabPanel({
applyTo: 'hello-tabs',
autoTabs: true,
activeTab: 0,
deferredRender: false,
border: false
}),
buttons: [{
text: 'Submit',
disabled: true
},
{
text: 'Close',
handler: function () {
win.hide();
}
}],
listeners: {
'render': function (c) {
alert("render");
}
}
}); // Work
win.on("show", function (c) {
alert("show");
}); //win.on("afterlayout", function(c, l) { alert("afterlayout"); });
//win.on("resize", function(c) { alert("resize"); });
// Doesn't work <--- Too Late. Window already rendered by the time this is added
win.on("afterrender", function (c) {
alert("afterrender");
});
win.on("render", function (c) {
alert("render");
});
}
win.show(this);
});
});