Question

I’m looking for a way to dynamically “click” the browse button of a input type="file". I have a button that contains an onclick event which I’d like to click the browse button of the input type="file", then an onchange event of the input type="file" will submit the form once the file is selected. I’m not sure how to “click” the input type="file" though.

Answer 1

All you need to do is call the click function of the input element from the desired element’s click handler.

<input type="file" id="files" name="files[]" multiple />
<div id="clickme">Click Me to Open File Browser</div>

document.getElementById('clickme').onclick = function() {
   document.getElementById('files').click(); 
}

Here is a working JSFiddle to show it in action.