PDA

View Full Version : try to add a ProgressBar or a LoadMask to an Ajax request



flamant
17 Mar 2011, 8:37 AM
Hi,
I try to add a progressbar to an ajax request

I already succeeded in adding a LoadMask to a HttpProxy using the following code



var waitMsg = (this.api[action]) ? this.api[action]['waitMsg'] : 'Please wait';
var myMask = new Ext.LoadMask(Ext.getBody(), {msg:waitMsg});
this.getConnection().on('beforerequest', myMask.show, myMask);
this.getConnection().on('requestcomplete', myMask.hide, myMask);
this.getConnection().on('requestexception', myMask.hide, myMask);


but for a ProgressBar, it doesn't work



var waitMsg = (this.api[action]) ? this.api[action]['waitMsg'] : 'pleaseWait';
var myMask = new Ext.ProgressBar({text:waitMsg});
this.getConnection().on('beforerequest', myMask.show, myMask);
this.getConnection().on('requestcomplete', myMask.hide, myMask);
this.getConnection().on('requestexception', myMask.hide, myMask);


Furthermore I would like to do the same with an Ajax request. For a a HttpProxy it was easy because I could override the doRequest method and put my code before the request is sent.

But for an Ajax request I have no method where I can put my code.

I tried to override the request method this way :



Ext.override(Ext.Ajax, {
request : function(o){
var me = this;
var waitMsg = (this.waitMsg) ? this.waitMsg : '<spring:message code="action.pleaseWait"/>';
var myMask = new Ext.LoadMask(Ext.getBody(), {msg:waitMsg});
this.on('beforerequest', myMask.show, myMask);
this.on('requestcomplete', myMask.hide, myMask);
this.on('requestexception', myMask.hide, myMask);
if(me.fireEvent(BEFOREREQUEST, me, o)){
...........................
...........................
}
});


without success.

Thank you in advance for your help.