Results 1 to 6 of 6

Thread: SOLVED: Window beforehide problem

  1. #1
    Touch Premium Member
    Join Date
    Mar 2007
    Posts
    67
    Vote Rating
    0
      0  

    Default SOLVED: Window beforehide problem

    I have an issue with a Window. I am trying to intercept the hide event. This works as hoped:
    Code:
    win.on('beforehide', function() {
      if(confirm("Are you sure?"))
        return true;
      else
        return false;
    });
    And stops the hide event. But I would like to do this:
    Code:
    win.on('beforehide', function() {
      Ext.MessageBox.confirm('Close', 'You may have unsaved changes. Continue?', 
        function(btn) {
           if(btn=='yes') return true;
           else return false;
      });
    });
    And it does not work (always continues with the hide).

    I suspect this is because the MessageBox has its own hide event and the win gets confused. Is there a way to workaround?
    Thanks!
    Last edited by JeffBurr; 6 Feb 2008 at 6:06 PM. Reason: Solved

  2. #2
    Sencha - Ext JS Dev Team evant's Avatar
    Join Date
    Apr 2007
    Location
    Sydney, Australia
    Posts
    18,583
    Vote Rating
    873
      1  

    Default

    It's because the MessageBox doesn't wait for a response.

    Try this:

    Code:
    Ext.Window.prototype.forceHide = function(animateTarget)
    {
       this.hidden = true;
       if (animateTarget !== undefined)
          this.setAnimateTarget(animateTarget);
    
       if (!this.animateTarget)
       {
          this.el.hide();
          this.afterHide();
       }
       else
          this.animHide();
    };
    
    win.on('beforehide', function()
    {
       Ext.MessageBox.confirm('Close', 'You may have unsaved changes. Continue?', 
        function(btn) {
           if(btn=='yes') win.forceHide();
      });
       return false; //always return false to wait for the response.
    }
    );

  3. #3
    Touch Premium Member
    Join Date
    Mar 2007
    Posts
    67
    Vote Rating
    0
      0  

    Default Thank You!

    I didn't intend to submit this as a "bug". I guess I shouldn't drink and post!

    Anyway, thanks for the solution - works perfectly.

  4. #4
    Ext User awahl's Avatar
    Join Date
    Feb 2008
    Location
    Germany, Montabaur
    Posts
    5
    Vote Rating
    0
      0  

    Thumbs up

    Great solution.. big thanks evant!

  5. #5
    Ext JS Premium Member
    Join Date
    Mar 2009
    Location
    Boston
    Posts
    28
    Vote Rating
    0
      0  

    Default

    Found this today and it works great.

    However, I am using modal windows, so in the event that anyone else is, you just need to add the following to the forceHide function. Otherwise the page stays masked, even though the window is closed.

    Code:
    if(this.modal){
      this.mask.hide();
      Ext.getBody().removeClass('x-body-masked');
    }

    Thanks,

    Jon

  6. #6
    Sencha - Ext JS Dev Team Animal's Avatar
    Join Date
    Mar 2007
    Location
    Notts/Redwood City
    Posts
    30,615
    Vote Rating
    55
      1  

    Default

    Easier is

    Code:
    win.on('beforehide', function() {
       Ext.MessageBox.confirm('Close', 'You may have unsaved changes. Continue?', 
        function(btn) {
           if(btn=='yes') {
             win.suspendEvents();
             win.hide();  // This cannot be vetoed because no events will be fired.
             win.resumeEvents();
           }
      });
      return false; //always return false to veto the hide.
    });

Posting Permissions

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