ExtJS 3.4 - How to prevent user clicking outside a window?

Question

In my application I have an Ext.Window component that gets created when a user clicks a button. While this window is open I do not want the user to be able to click anywhere outside of this window until either the window is closed or submitted, similar to how an Ext.LoadMask freezes everything on the page. I can successfully create the window and I think the correct method that I am looking for is the focus() method, but this isn't working for me. It has no effect at all.

I'm wondering if I am doing something wrong, if I've mistaken the purpose of the focus() method, or if there is another way of achieving what I am trying to do. Below is my code:

var window = new Ext.Window({
  title: 'Specify rezoning details',
  layout: 'fit',
  closable: false,
  width: 300,
  height: 200,
  items: [zoningCombo],
  buttons: [submitButton, cancelButton]
});
window.show(); //This works
window.focus(); //THIS DOES NOT WORK TO PREVENT INPUT ELSEWHERE

Thanks for any help.

R

Answer 1

Specify modal: true in your configuration for the window.

Reference: http://docs.sencha.com/extjs/3.4.0/#!/api/Ext.Window-cfg-modal