Solved: Toolbar button with menu help

[wiredmonkey]

Hi

I have a simple toolbar button which when pressed displays a small upload form, it works fine, but once it upload is complete, I ve been unable to find a way to hide the form and reset the button.



this.tb = new Ext.Toolbar(this.dlg.body.createChild({tag:'div'}),[
{text:'Upload',enableToggle:true,menu:{}},'-',
{text:'Refresh',handler:this.reload.bind(this)},'-',
{text:'Delete',disabled:true,handler:this.deleteImage.bind(this)},'-'
]);

this.tb.items.items[0].menu.getEl().createChild({tag: 'div', id: 'uiform',style:'padding:5px;background-color:#FFFFFF'});

uploadForm = new Ext.form.Form({
baseParams:{filefield:'image',himageid:2},
fileUpload: true,
labelWidth:80,
buttonAlign: 'center',
waitMsgTarget: true,
url: 'upload.cfm?uploadType=image'
});
fileField = new Ext.form.TextField({
fieldLabel: 'Image File',
defaultAutoCreate : {tag:"input", enctype:"multipart/form-data", type:"file", size: "20", autocomplete: "off"},
name: 'image',
allowBlank: false,
invalidText:'File type must be: .gif, .jpg, .png',
validator: function(value){
value = value.toLowerCase();
value = value.substring(value.lastIndexOf('.')+1, value.length);
ret = value=='gif' || value=='jpg' || value=='png';
return ret;
}
});
uploadForm.add(fileField);

fileField.on('change', function() {uploadForm.submit({waitMsg:'Uploading image file...'}); }, this, true);

this.uploadSuccess = function() {
this.tb.items.items[0].hide();
this.reload();
}
uploadForm.addListener('actioncomplete', this.uploadSuccess, this);


Any help or advice appreciated!

best

Shaun

Finally worked it out it was simply "this.tb.items.items[0].menu.hide();"

[CodeSchmoe]

Hello WiredMonkey,

I've been working with ExtJS for a bit now trying to do exactly what you've accomplished. =D>

Please, please, please post a small but complete working example, HTML and all!! Many people prowling the forums will be deliriously grateful. I myself will name children after you!! :D