How to trigger INPUT FILE event REACTJS by another DOM

Question

I have a INPUT BUTTON and INPUT FILE, I want to click the BUTTON and it will trigger the INPUT FILE event

Answer 1

You don't need jQuery for this. You don't even need an event handler. HTML has a specific element for this, called label.

First, make sure your input element has an id attribute:

React.createElement('input',{type:'file', name:'myfile', id:'myfile'})

Then, instead of:

React.createElement('a',{onClick: this.doClick},'Select File')

Try:

React.createElement('label',{htmlFor: 'myfile'},'Select File')

(Instead of adding htmlFor and id attributes, another solution is to make the input element a child of the label.)

Now clicking the label should trigger the same behaviour as clicking the input itself.