I can't seem to figure out any way to remove the "No file selected" text that shows up next to inputs of type "file".
Do you guys know any way how to remove this text?
Remove the value('No file chosen'). Use . addClass() method to add the class which removes the value “No file chosen”.
Hide the input with css, add a label and assign it to input button. label will be clickable and when clicked, it will fire up the file dialog. Then style the label as a button if you want. This even works in IE9, where you can't hide the file input and click it from JavaScript.
input[type='file'] { color: transparent; }
Enjoy
There is no cross-browser way to do this. The "no file selected" text is in the implementation-defined part of the widget, and I don't believe that most browsers offer much in the way of browser-specific customization. On the other hand, you could simply use CSS to cover the text with something when the value attribute is empty.
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