I am wondering how to hide the text field portion of a standard html file upload tag
for example
<input type="file" name="somename" size="chars">
This generates obviously a text field and next to that field is a browse button... I want to hide the text field part but keep the button.
As mentioned in previous answers we cannot restrict user to select files for only given file formats. But it's really handy to use the accept tag on file attribute in html. As for validation, we have to do it at the server side. We can also do it at client side in js but its not a foolproof solution.
This will surely work i have used it in my projects.I hope this helps :)
<input type="file" id="selectedFile" style="display: none;" /> <input type="button" value="Browse..." onclick="document.getElementById('selectedFile').click();" />
I'd recommend hiding the whole thing and putting a separate button object which, when clicked, will end up clicking the input's browse button.
You can do this with CSS and javascript -- check out this article (actually the second time I've used this reference today).
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With