Hello.
I work with ExtJS 3.1 . When executing a JS code, let's say:

 ... .... .... ... thisWindow.close(); Data.loadHtmlForm();// Берем с сервера некоторые данные openNextWindow();// открыть следующее окно, в котором должны быть загруженные данные. 

The current window closes, followed by an Ajax request that lasts for a while. The problem is that while the Ajax request is executed, the following functions continue to be executed.

Question: How to suspend further execution of the code until the request to the server is completed? Or how can I make a mask for the panel at boot time? Here, the Data.loadHtmlForm() function loads data from the server and initializes the htmlBlank variable with htmlBlank . I give the code of my panel:

 xtype : 'panel', html : htmlBlank, x : 0, y : 0, width : 600, height : 850, id : 'panelId' 

    1 answer 1

    The point is that if we load the information from the database into the grid, and while it loads to display the Cool Hacker "Loading ...", then we can use the mask, having attached it initially to the Store loading:

    var companies = new Ext.data.Store ({reader: new Ext.data.JsonReader ({fields: ['user_id', 'user_login', 'user_profile_name',], root: 'rows'}), proxy: new Ext .data.HttpProxy ({url: 'url which loads companies from DB / companies.php'}), autoLoad: false});

    Initially, autoLoad is set to false, and then after connecting the mask we will already load companies.load (); The mask becomes associated with the storage companies:

    var card = Ext.get ('cardID'); var mask = new Ext.LoadMask (Ext.get ('cardID'), {msg: "Loading data ...", store: companies}); companies.load ();

    cardID is the tab identifier in the grid: var viewport = new Ext.Viewport ({bla bla ... items: [{title: 'Cards', xtype: 'editorgrid', id: 'cardID', clickstoEdit: 1, store: companies, colModel: new Ext.grid.ColumnModel ({blah blah ...