Adding loadMask to a gridpanel...

[bzborow1]

Hi guys,

I'm a long-time j2ee programmer, but am a newbie with this extjs stuff. My problem is that I'm trying to create as elegant a solution to a gridpanel of web service results. How do I add a loading mask into an Ext.grid.GridPanel object that is contained within an Ext.Window?


//define the result grid.
this._gridControl = new Ext.grid.GridPanel({
id: 'gridControlCpl',
store: this._store,
cm: this._columnModel,
sm: new Ext.grid.RowSelectionModel({singleSelect:true}),
enableColLock: false,
height: this.height,
width: this.width,
view: new Ext.grid.GridView({
forcFit: true,
autofill: true
}),
layout: 'fit',
autoDestroy: false,
loadMask: true
});

this._store.load({
params: this._params
});

[bzborow1]

Hmmm...Okay. I think I've got something working, however it's not really what I want. I can get it to load a basic mask using defaults ("Loading..."), but I need more. I need to be able to change the msg value of a load mask object, but can't seem to get it to work.



//define the result grid.
this._gridControl = new Ext.grid.GridPanel({
id: 'gridControlCpl',
store: this._store,
cm: this._columnModel,
sm: new Ext.grid.RowSelectionModel({singleSelect:true}),
enableColLock: false,
height: this.height,
width: this.width,
view: new Ext.grid.GridView({
forcFit: true,
autofill: true
}),
layout: 'fit',
autoDestroy: false,
loadMask: true,
listeners: {
afterlayout: function(grid) {
if(grid.loadMask) {
grid.loadMask.show();
}
}
}
});

this._store.load({
params: this._params
});

[AndreaCammarata]

Hi bzborow.
This is Sencha Touch Panel, you have to post to Ext Help forum.

However, all you need is to add one more config param to your grid:



loadMask: true,
loadMask: {msg:'Your loading message'},
Hope this helps.