Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to remove "no file selected" from type=file inputs?

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?

enter image description here

like image 663
Peter Avatar asked May 24 '11 02:05

Peter


People also ask

How do you remove no file selected in file input?

Remove the value('No file chosen'). Use . addClass() method to add the class which removes the value “No file chosen”.

How do you change no file selected text input?

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.


2 Answers

input[type='file'] {   color: transparent; } 

Enjoy

like image 56
Ajey Avatar answered Sep 24 '22 08:09

Ajey


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.

like image 34
Thom Smith Avatar answered Sep 23 '22 08:09

Thom Smith