Asp:FileUpload edit “No file selected” message

Question

I just need to know if there\'s a way to change the message shown by the Asp:FileUpload when no file as been selected.

Answer 1

You replace the text with your own message using CSS pseduo-class :after. You can declare a class like this one:

.bar:after {
    content:"Please select a file";
    background-color:white;
}

And assign it to your FileUpload control. The content message will replace the original one. Of course upon file selection you need to remove the message, you can do this for example via jQuery .removeClass (assuming ID of your FileUpload is "foo"):

$('#foo').change(function() {
    $(this).removeClass("bar");
})

Demo: http://jsfiddle.net/5zhuL/2/

Note that this solution seems to work Webkit-browser's only (Chrome, Opera, Safari) you may need an alternative for others.