The code below has three combo boxes in a form. On selection of the first combo i load the store for the second combo, and on selection of the second combo i load the store for the third combo. when a selection is made in the first or second combo a load mask shows in the top left corner of the browser window. You can only see about half of the load mask. I am not sure if this is a bug or something I am doing wrong. I had a similar issue here http://www.sencha.com/forum/showthre...056#post655056 but I was able to correct it by using seperate stores for the grids. In the code below, each combo uses it's own store.

Code:
Ext.onReady(function(){
        
    Ext.define('BarCodeDefinition', {
        extend: 'Ext.data.Model',
    
        fields: [
            {name: 'id', type: 'int' },
            {name: 'name'},
            {name: 'number', type: 'int'},
            {name: 'Cat1-name', serverVal: 'cat_1'},
            {name: 'Cat2-name', serverVal: 'cat_2'},
            {name: 'Cat3-name', serverVal: 'cat_3'},          
            {name: 'created', type: 'date', dateFormat: 'n/j h:ia'},
            {name: 'modified', type: 'date', dateFormat: 'n/j h:ia'},
        ]        
    });

    var store = Ext.create('Ext.data.Store', {
        model: 'BarCodeDefinition',
        pageSize: itemsPerPage,
        proxy: {
            type: 'ajax',
            api: {
                create: '/admin/bar_code_definitions/add/',
                read: '/admin/bar_code_definitions',
                update: '/admin/bar_code_definitions/edit/',
                destroy: '/admin/bar_code_definitions/delete/'
            },
            reader: {
                type: 'json',
                root: 'definitions',
            },
            writer: {
                root: 'data[BarCodeDefinition]',
                encode: true,
                writeAllFields: false,
                nameProperty: 'serverVal'
            },
            directionParam: 'direction',
            simpleSortMode: true      
        },
        remoteSort: true,      
        autoLoad: true,
        listeners: {
            write: function(store, operation, eOpts) {
                var responseTxt = Ext.JSON.decode(operation.response.responseText);
                if(!responseTxt.success || !operation.success )    {
                    var msg = null;
                    switch(operation.action) {
                        case 'destroy' : 
                            msg = 'Unable to delete definition.';
                            break;
                        case 'create' :
                            msg = 'Unable to create definition.';
                            break;
                        case 'update' :
                            msg = 'Unable to update definition.';
                            break;    
                    }
                    Ext.MessageBox.alert('Status', msg);
                }
                if(responseTxt.success) {
                    Ext.MessageBox.hide();
                    if(operation.action === 'create' || operation.action === 'update') {
                        gridForm.getForm().reset();
                        Ext.getCmp('cat2Name').disable();
                        Ext.getCmp('cat3Name').disable();
                        store.load();                            
                    }
                    if(operation.action === 'destroy') {
                        gridForm.getForm().reset();
                        Ext.getCmp('cat2Name').disable();
                        Ext.getCmp('cat3Name').disable(); 
                        store.load();                        
                    }                    
                }    
            },
            beforesync: function(){
                Ext.MessageBox.wait('Please Wait......');
            }
        }
    });    
    
    Ext.define('DocumentFilingCategory', {
        extend: 'Ext.data.Model',
        fields: [{name: 'id', type: 'int'}, {name: 'name'}]
    });   
    
    var catProxy = Ext.create('Ext.data.proxy.Ajax', {
        url: '/admin/document_filing_categories/get_cats',
        reader: {
            type: 'json',
            root: 'cats'
        },
        extraParams: {
            parentId: 'parent'
        }        
    });
    
      var cat1Store = Ext.create('Ext.data.Store', {
        model: 'DocumentFilingCategory',
        proxy: catProxy,
        autoLoad: true
    });
    
      var cat2Store = Ext.create('Ext.data.Store', {
        model: 'DocumentFilingCategory',
        proxy: catProxy,
        listeners: {
            load: function(store, records, successful, operation, eOpts) {
                if(records[0]) {
                    Ext.getCmp('cat2Name').enable();
                }
            }
        }
    });
    
    var cat3Store = Ext.create('Ext.data.Store', {
        model: 'DocumentFilingCategory',
        proxy: catProxy,
        listeners: {
            load: function(store, records, successful, operation, eOpts) {
                if(records[0]) {
                    Ext.getCmp('cat3Name').enable();
                }
            }
        }        
    });
    
    var gridForm = Ext.create('Ext.form.Panel', {
        id: 'barCodeDefinitionsForm',
        frame: true,
        title: 'Bar Code Definitions',
        bodyPadding: 5,
        width: 950,
        layout: 'column',
        fieldDefaults: {
            labelAlign: 'left',
            msgTarget: 'side'
        },
        items: [{
            columnWidth: 0.60,
            xtype: 'gridpanel',
            id: 'barCodeDefGrid',
            store: store,
            height: 315,
            title:'Definitions',
            columns: [{
                text: 'id',
                dataIndex: 'id',
                hidden: true
            },{
                text: 'Name',
                dataIndex: 'name'
            },{
                text: 'Number',
                dataIndex: 'number'
            },{
                text: 'Cat 1',
                dataIndex: 'Cat1-name',
                flex: 1
            },{
                text: 'Cat 2',
                dataIndex: 'Cat2-name',
                flex: 1               
            },{
                text: 'Cat 3',
                dataIndex: 'Cat3-name',
                flex: 1              
            }],
            tbar: [{xtype: 'tbfill'},{ 
                xtype: 'button', 
                text: 'New Definition',
                icon: '/img/icons/add.png',
                handler: function() {
                    this.up('form').getForm().reset();
                    Ext.getCmp('cat2Name').disable();
                    Ext.getCmp('cat3Name').disable();
                    this.up('grid').getSelectionModel().deselectAll();
                } 
            },{
                xtype: 'button',
                text: 'Delete Definition',
                icon: '/img/icons/delete.png',
                handler: function() {
                    Ext.MessageBox.confirm('Confirm', 'Delete the selected record?', function(id){
                        if(id === 'yes') {    
                            var record = Ext.getCmp('barCodeDefGrid').getSelectionModel().getLastSelected();
                            store.remove(record);               
                            store.sync();
                        } 
                        else {
                            return false;
                        }                     
                    });
                }
            }],
            dockedItems: [{
                xtype: 'pagingtoolbar',
                store: store,
                dock: 'bottom',
                displayInfo: true
            }],            
            listeners: {
                selectionchange: function(model, records) {
                    Ext.getCmp('cat2Name').disable();
                    Ext.getCmp('cat3Name').disable();  
                    if (records[0]) {
                        var vals = {
                            name: records[0].data.name,
                            number: records[0].data.number
                        }
                        this.up('form').getForm().loadRecord(records[0]);
                    }
                    this.up('form').getForm().clearInvalid();
                }
            }
        }, {
            columnWidth: 0.4,
            margin: '0 0 0 10',
            padding: 10,
            xtype: 'fieldset',
            frame: true,
            title:'Add / Edit Form',
            defaults: {
                width: 300,
                labelWidth: 50
            },
            defaultType: 'textfield',
            items: [{
                name: 'id',
                xtype: 'hidden'
            },{
                fieldLabel: 'Name',
                name: 'name',
                allowBlank: false,
                maxLength: 100,
                enforceMaxLength: true,                
            },{
                fieldLabel: 'Number',
                xtype: 'numberfield',
                width: 100,
                minValue: 0,
                maxValue: 99999,
                maxLength: 5,
                enforceMaxLength: true,
                hideTrigger: true,
                name: 'number',
                allowBlank: false
            },{
                fieldLabel: 'Cat 1',
                name: 'Cat1-name',
                id: 'cat1Name',               
                store: cat1Store,
                displayField: 'name',
                valueField: 'id',        
                queryMode: 'local',
                xtype: 'combo', 
                value: null,
                allowBlank: false,
                listeners: {
                    select: function(combo, records, Eopts) {
                        if(records[0]) {
                            Ext.getCmp('cat2Name').disable();
                            Ext.getCmp('cat2Name').reset();
                            Ext.getCmp('cat3Name').disable();
                            Ext.getCmp('cat3Name').reset(); 
                            cat2Store.load({params: {parentId: records[0].data.id}});
                        }
                        
                    }
                }
            },{
                fieldLabel: 'Cat 2',
                name: 'Cat2-name',
                id: 'cat2Name',
                xtype: 'combo',
                disabled: true,
                store: cat2Store,
                displayField: 'name',
                valueField: 'id',
                queryMode: 'local',
                value: null,
                allowBlank: false,
                listeners: {
                    select: function(combo, records, Eopts) {
                        if(records[0]) {
                            Ext.getCmp('cat3Name').disable();
                            Ext.getCmp('cat3Name').reset();
                            cat3Store.load({params: {parentId: records[0].data.id}});
                        }                    
                    }
                }                
            },{
                fieldLabel: 'Cat 3',
                name: 'Cat3-name',
                id: 'cat3Name',
                xtype: 'combo',
                store: cat3Store,
                disabled: true,
                displayField: 'name',
                valueField: 'id',
                queryMode: 'local',
                value: null,
                allowBlank: false
            }]
        }],
        buttons: [{
            text: 'Save',
            handler: function() {
                var form = this.up('form').getForm();
                var vals = form.getValues();
                if(form.isValid()) {
                    if(vals.id != '') {
                        var barCodeDefinition = store.getById(parseInt(vals.id, 10));
                        barCodeDefinition.set(vals)
                    }
                    else {
                        var barCodeDefinition = Ext.create('BarCodeDefinition', form.getValues());
                        store.add(barCodeDefinition);
                    }            
                    store.sync();                
                }        
            }          
        }],        
        renderTo: 'barCodeDefinitions'
    });    
});