How to: Window that closes when clicked outside of it

[abcdef]

How do I have a window that closes itself when the user clicks anywhere outside of it?

[slemmon]

I saw the following (excerpt) in the menu.Manager class the other day. Probably could be used for what you're wanting.
http://docs.sencha.com/ext-js/4-0/source/Manager.html#Ext-menu-Manager

I bolded the juicy bits. In the window you'd set a cls property to watch for and then just reference it in the red conditional below.


onHide: function(m) {
var me = this,
active = me.active;
active.remove(m);
if (active.length < 1) {
Ext.getDoc().un('mousedown', me.onMouseDown, me);
me.attached = false;
}
},


onShow: function(m) {
var me = this,
active = me.active,
last = active.last(),
attached = me.attached,
menuEl = m.getEl(),
zIndex;


me.lastShow = new Date();
active.add(m);
if (!attached) {
Ext.getDoc().on('mousedown', me.onMouseDown, me);
me.attached = true;
}
m.toFront();
},



onMouseDown: function(e) {
var me = this,
active = me.active,
lastShow = me.lastShow;


if (Ext.Date.getElapsed(lastShow) > 50 && active.length > 0 && !e.getTarget('.' + Ext.baseCSSPrefix + 'menu')) {
me.hideAll();
}
},

[abcdef]

Perfect. Thanks!