File upload and localization

[birthe]

I am developing a website that needs to be localized. I use the <input type=file> to allow the users to upload files.

How the control is displayed depends on the browser. In Explorer on Mac I see a text field and a submit button names 'Browse...'. Apple's browser Safari displays a submit button named 'Choose File' and the initial string 'no file selected'.

My question is how I get control of the title of the submit buttons and the initial text displayed?

[Mr J]

There is a work round for this for IE which requires using a seperate text and button and hiding the file input.

Please try the 2 versions below, one uses buttons whilst the other uses image.

I do not have mac so I don't know if this works on it




<script language="javascript">
<!--
function upload(){
which_image1=document.f1.image_file1.value
if(which_image1==""){
return
}
else{
document.image2.src=which_image1
}
}
// -->
</script>

<form name="f1">
<input name="image_file1" type="file" style="display:none" onchange="txt1.value=this.value">
<input type="text" name="txt1">
<input type="button" value="Show me what you've got dude" onclick="image_file1.click()">
<input type="button" value="I'll take it" onclick="upload()">
</form>


<img name="image2" src="">

<script language="javascript">
<!--
function upload2(){
which_image2=document.f2.image_file2.value
if(which_image2==""){
return
}
else{
document.image2.src=which_image2
}
}
// -->
</script>

<form name="f2">
<input name="image_file2" type="file" style="display:none" onchange="txt2.value=this.value">
<input type="text" name="txt2">
<input type="image" src="pic1.jpg" onclick="image_file2.click(); return false">
<input type="image" src="pic2.jpg" onclick="upload2();return false">
</form>