PDA

View Full Version : Confused where to put "beforeDestroy" method of "beforedestroy" event.



srkngrt
27 Nov 2011, 12:11 AM
Hello community,

I'm trying to explore the example Desktop. I wanted to add a msg box to ask the user if they are sure to close for example the window notepad or not. My first idea was to add the code in the notepad.js

I've put it between layout and items:



...
// IE has a bug where it will keep the iframe's background visible when the window
// is set to visibility:hidden. Hiding the window via position offsets instead gets
// around this bug.
hideMode: 'offsets',
layout: 'fit',
beforeDestroy: function() {
alert('Hehe');
},
items: [{
xtype: 'htmleditor',
id: 'notepad-editor',
value: [...


When I close the Notepad window in the desktop it will close and after it is closed my alert popup is shown. I get the same result when I work with adding listeners.

Then I tried to move this to the /js/Desktop.js file where the window creation is coded. But also here my alert will show after the notepad window is already closed. I've added the code in the first win.on() right under the beforeshow rule.

Can someone point me the correct way here please? I found several post on this issue, but I think this desktop example is probably an other case than the single examples in the other posts? I assume that making an autosave function while closing the window will have the same problem and seems to me as I didn't get the clue yet where to put things...

mitchellsimoens
27 Nov 2011, 6:28 AM
Are you sure you don't want to use 'beforeclose' event to stop the closing of the Window?

srkngrt
27 Nov 2011, 1:58 PM
I also tried that event trigger, but I get the same result, window first closes and afterwards the function is fired. It feels like I'm placing the trigger in a wrong place...

mitchellsimoens
27 Nov 2011, 2:03 PM
You have to return false because things will be async. Then when your user chooses yes, close the window. You should make your beforeclose event listener fire only once by using the single listener config. That way when you close the window the second time, the listener won't be fired.

srkngrt
27 Nov 2011, 2:25 PM
Ok, I changed it to a single listener after the win.show(); I think you meant this:



win.show();
win.addListener('beforedestroy', function(){
Ext.MessageBox.confirm('Notepad Closing', 'Are you sure', this.onSavenotepad)
});


When I hit the close icon, window closes immediately and then the message box is showing.
When I answer with cancel the window is closed, it doesn't appear back or so.

So, visual there is no change in that, however I thank you pointing out this feature :D

srkngrt
27 Nov 2011, 2:30 PM
That way when you close the window the second time, the listener won't be fired.

Closing a window the second time ? Not sure what you mean by that Mitchell, is it simply open window, close window, re-open window and close it the second time ? Sorry if this sounds silly...

mitchellsimoens
27 Nov 2011, 2:32 PM
Like I said, use beforeclose. beforedestroy is too late. Didn't want to do it for you but here you go:


var beforeclose = function(w) {
Ext.Msg.confirm('Confirmation', 'Are you sure you want to close without saving?', function(btn) {
if (btn === 'yes') {
w.close();
} else {
w.on('beforeclose', beforeclose, w, { single : true });
}
});

return false;
};

var win = Ext.create('Ext.window.Window', {
title : 'Test',
width : 400,
height : 400,
html : 'Close Me',
listeners : {
beforeclose : {
single : true,
fn : beforeclose
}
}
});

win.show();

srkngrt
27 Nov 2011, 3:27 PM
Ok Mitchell, thnx, this rises other questions but I have enough to learn from this example. I'll come back once I've figured it out :-) Now I'm having errors which give me something to look after...

srkngrt
27 Nov 2011, 3:51 PM
Ok, couldn't goto bed before trying, have it working in the desktop example. Thnx again for the help !!!



createWindow : function(){
var desktop = this.app.getDesktop();
var win = desktop.getWindow('notepad');
if(!win){
win = desktop.createWindow({
id: 'notepad',
title:'<?php echo lang('general_notepad'); ?>',
width:600,
height:400,
iconCls: 'notepad',
animCollapse:false,
border: false,
//defaultFocus: 'notepad-editor', EXTJSIV-1300


// IE has a bug where it will keep the iframe's background visible when the window
// is set to visibility:hidden. Hiding the window via position offsets instead gets
// around this bug.
hideMode: 'offsets',


layout: 'fit',
items: [
{
xtype: 'htmleditor',
id: 'notepad-editor',
value: ['Give it a try!'].join('')
}
],
listeners : {
beforeclose : {
single : true,
fn : this.onsavenotepad
}
}
});
}
win.show();
return win;
},
onsavenotepad: function (w) {
Ext.MessageBox.confirm('<?php echo lang('general_closing'); ?>'+' '+'<?php echo lang('general_notepad'); ?>', '<?php echo lang('general_areyousure'); ?>', function(btn) {
if (btn == 'yes') {
w.close();
//window.location.href = "/logout";
} else {
w.on('beforeclose', this.onsavenotepad, w, { single : true });
Ext.messenger.msg('<?php echo lang('general_opcancelled'); ?>', '<?php echo lang('general_cancelnotepad'); ?>');
}
});
return false;
}