Page 1 of 1

Browse button styling

Posted: Tue Jun 30, 2009 7:33 am
by rajsekar2u
Hi,
I used the below code to upload file form.

Code: Select all

<script type="text/javascript">
function test()
{
    document.form1.browse1.click();
    alert("dasdas");
}
</script>
<form name="form1" action="#" method="post">
<input name="browse1" type="file" style="display: none;">
<input name="file" type="text">
<input name="Submit" type="button"  value="Browse" onClick="test(); document.form1.file.value=document.form1.browse1.value; return false;">
<input name="upload" type="submit"  value="Upload" onclick='document.form1.browse1.disabled=true;'>
</form>
Its working in IE6.

But its not working in mozilla.

Is there any other way to do this.

Re: Browse button styling

Posted: Tue Jun 30, 2009 10:14 am
by pickle
File upload type buttons are dang near impossible to style - they have always been that way. They're also dang hard to script - most browsers don't want the browser itself to determine which file to upload - that's a big security issue. There are a few tutorials out there explaining how to put other elements on top of file upload buttons - but I've never seen anything that allows you to style the button itself too much.