Add an input element of type=file in tinymce container

Question

I am trying to extend a tinymce pluggin and need to add an input element of type=file. (I am new to such an exercise so please pardon my ignorance.. Also could not find examples/samples to work with..) It seems you can do the following to show elements to a container that opens in a panel : ``` var generalFormItems = [ {name: 'alt', type: 'textbox', label: 'Image description'}, {name: 'width', type: 'textbox', maxLength: 3, size: 3, onchange: recalcSize}, ]; win = editor.windowManager.open({ title: 'Insert/edit image', data: data, bodyType: 'tabpanel', body: [ { title: 'General', type: 'form', items: generalFormItems }, ], onSubmit: onSubmitForm }); ``` I am interested in adding an input html of type=file (`<input type="file".../>`). So there should be the usual html button that will show the 'file dialog' on the browser to allow the user to pick a file. So something like this I am hoping : ``` var generalFormItems = [ {name: 'alt', type: 'textbox', label: 'Image description'}, {name:…

Accepted Answer

Managed to figure this out and want to leave the answer here for others trying to do something similar.

There is a 'subtype' on each of the UI form elements that will get added to the DOM as is. So doing the below did the trick for me :

```
{name: 'file', type: 'textbox', subtype: 'file', label: 'Upload', onchange: uploadFile},
```

Add an input element of type=file in tinymce container

Solution

Problem