View Full Version : Ext.ux.form.FileUploadField: Button just does nothing

24 Nov 2010, 1:28 AM
Hello! I use the class Ext.ux.form.FileUploadField from the examples-folder of JsExt 3.3.0. The example works fine, but when adding the code to my form like:

{ xtype: 'fileuploadfield',
fieldLabel: 'Upload file',
id: 'FileUploadId',
emptyText: '',
buttonText: 'Select file',
name: 'FileUpload'

just nothing is happening when pressing the 'Select file' button.

I have no idea how to debug this. How is the button to react on the click-event? What should happen in code? I found the creation of the button in the source:

this.button = new Ext.Button(Ext.apply(btnCfg, {
renderTo: this.wrap,
cls: 'x-form-file-btn' + (btnCfg.iconCls ? ' x-btn-icon' : '')

but there are no listeners or anything I could check... Pls help.

24 Nov 2010, 1:47 AM
The button in FileUploadField is only there to make the input look like a button. When you click on it, you actually click in the <input type="file"> that is transparent and overlayed over the button.

1. Did you include the fileuploadfield.css?
2. FileUploadField needs a width or an anchor.

24 Nov 2010, 2:41 AM
Ah, I see: when making the browser-button visible, it was displaced by some other css-code:
input {
width: 300px;

.x-form-file-wrap .x-form-file {
did the trick, so thanks for the hint!