Sometimes, we want to show only the button with file input in HTML and JavaScript.
In this article, we’ll look at how to show only the button with file input in HTML and JavaScript.
How to show only the button with file input in HTML and JavaScript?
To show only the button with file input in HTML and JavaScript, we hide the file input and add another button to open the file selection dialog.
For instance, we write
<input
type="button"
value="Choose image"
onclick="javascript:document.getElementById('imagefile').click();"
/>
<input id="imagefile" type="file" style="visibility: hidden" name="img" />
to add an input that clicks on the file input with document.getElementById('imagefile').click() when we click on it.
We hide the file input with visibility: hidden.
Conclusion
To show only the button with file input in HTML and JavaScript, we hide the file input and add another button to open the file selection dialog.
