Results 1 to 5 of 5

Thread: Need a confirmation message before closing the window

  1. #1
    Sencha User
    Join Date
    Apr 2014
    Posts
    53

    Default Answered: Need a confirmation message before closing the window

    Hi all,

    I have a Ext.window and I would like to display a confirmation message before a user tries to close the window either by clicking the close button in the window or the default [x] button in the top or by Esc key. I have the following code for this purpose.

    closeWindow: function(){
    Ext.Msg.show({
    title: 'Confirm or Cancel',
    msg: 'Are you sure you want to close this window?',
    buttonText: {ok: 'Yes', cancel: 'No'},
    icon: Ext.Msg.WARNING,
    scope: this,
    width: 400,
    fn: function(btn, text){
    if (btn == 'ok'){
    clearInterval(this.myIntervalTimer);
    this.cleanEvents(null, null, this.identifier);
    this.view.destroy();
    } else {
    return;
    }
    }
    });
    }
    This piece of code works fine when I click on the Close button in the window. But when I click the default close[x] or the esc key, due to async nature of extjs the window disappears before the confirmation message gets displayed. When the confirmation message displays there is no window and so it is becoming irrelevant. I tried using the beforeClose event as well but of no use.

    Any suggestions or ideas of how this can be achieved in extjs?. Thanks...

  2. Why don't you define your window class like this.
    Code:
    Ext.define('MyApp.view.MyWindow', {
        extend: 'Ext.window.Window',
        alias: 'widget.mywindow',
    
        close: function() {
            if (this.fireEvent('beforeclose', this) !== false) {
                Ext.Msg.show({
                    title: 'Confirm or Cancel',
                    msg: 'Are you sure you want to close this window?',
                    buttonText: {ok: 'Yes', cancel: 'No'},
                    icon: Ext.Msg.WARNING,
                    scope: this,
                    width: 400,
                    fn: function(btn, text){
                        if (btn === 'ok'){
                            this.doClose();
                        }
                    }
                });
            }
        }
    });
    If default window(Ext.window.Window) is overridden, it has a bad effect on Ext.window.MessageBox (because Windows subclass).

  3. #2

    Default

    i guess it will be something like this :

    PHP Code:
    Ext.create('Ext.window.Window', {    
      
    title'Hello',    
      
    closeAction 'destroy'    
      
    items: [],    
      
    listeners :{        
        
    beforedestroy: function() { 
               
    //Msgbox : are you sure?       
        
    }    
      }
    }).
    show(); 

  4. #3
    Sencha User
    Join Date
    Apr 2014
    Posts
    53

    Default

    I tried this but of no use. I am trying to see how I can override the default window close functionality. Any suggestions please?..

  5. #4
    Sencha Premium Member
    Join Date
    Sep 2012
    Location
    Tokyo
    Posts
    13
    Answers
    2

    Default

    Why don't you define your window class like this.
    Code:
    Ext.define('MyApp.view.MyWindow', {
        extend: 'Ext.window.Window',
        alias: 'widget.mywindow',
    
        close: function() {
            if (this.fireEvent('beforeclose', this) !== false) {
                Ext.Msg.show({
                    title: 'Confirm or Cancel',
                    msg: 'Are you sure you want to close this window?',
                    buttonText: {ok: 'Yes', cancel: 'No'},
                    icon: Ext.Msg.WARNING,
                    scope: this,
                    width: 400,
                    fn: function(btn, text){
                        if (btn === 'ok'){
                            this.doClose();
                        }
                    }
                });
            }
        }
    });
    If default window(Ext.window.Window) is overridden, it has a bad effect on Ext.window.MessageBox (because Windows subclass).

  6. #5
    Sencha User
    Join Date
    Apr 2014
    Posts
    53

    Default

    Thanks Yuki, That worked....

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •