Sometimes, we want to programmatically trigger select file dialog box with JavaScript.
In this article, we’ll look at how to programmatically trigger select file dialog box with JavaScript.
How to programmatically trigger select file dialog box with JavaScript?
To programmatically trigger select file dialog box with JavaScript, we call the click
method.
For instance, we write
<input id="myInput" type="file" style="visibility: hidden" />
<input
type="button"
value="Show Dialog"
onclick="document.querySelector('#myInput').click();"
/>
to add a file input and a button.
Then we set the onclick attribute of the input to document.querySelector('#myInput').click();
to select the file input with querySelector
when we click it.
And then we call click
on it to open the file input.
Conclusion
To programmatically trigger select file dialog box with JavaScript, we call the click
method.