I have a J2EE web app with a form where I upload a file to a location on a server. During the upload a waitMsg is shown to the user which should disappear once the upload is completed with a msgBox indicating the same. The code for the success case is also provided in the js file. However the upload works fine, but the waitMsg continues even after the upload at the server has completed.
The js code is given:
Ext.onReady(function(){
Ext.QuickTips.init();
var msg = function(title, msg){
Ext.Msg.show({
title: title,
msg: msg,
minWidth: 200,
modal: true,
icon: Ext.Msg.INFO,
buttons: Ext.Msg.OK
});
};
var fp = new Ext.FormPanel({
renderTo: 'fi-form',
fileUpload: true,
width: 500,
frame: true,
title: 'Upload XML Config File ',
autoHeight: true,
bodyStyle: 'padding: 10px 10px 0 10px;',
labelWidth: 50,
defaults: {
anchor: '95%',
allowBlank: false,
msgTarget: 'side'
},
items: [{
xtype: 'fileuploadfield',
id: 'form-file',
emptyText: 'Select the xml File to upload',
fieldLabel: 'File',
name: 'file',
buttonCfg: {
text: '',
iconCls: 'upload-icon'
}
}],
buttons: [{
text: 'Upload',
handler: function(){
if(fp.getForm().isValid()){
fp.getForm().submit({
url: 'uploadXML.htm',
waitMsg: 'Uploading your xml file...',
success: function(fp, o){
msg('Success', 'Processed file "'+o.result.file+'" on the server');
}
});
}
if (!validateFileExtension(Ext.getDom('form-file').value)) {
Ext.MessageBox.alert('Select another file',
'Only XML file, please.');
return;
}
}
},{
text: 'Reset',
handler: function(){
fp.getForm().reset();
}
}]
});
function validateFileExtension(fileName) {
var exp = /^.*\.(xml|XML)$/;
return exp.test(fileName);
}
});
Not sure what I am missing.
Thanks in advance.