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.