Page 1 of 1

Copy browse button's file URL to different text input?

Posted: Sun Feb 10, 2008 1:17 pm
by JAB Creations
I've successfully created a completely CSS customized mouse/keyboard browse button for uploading files on my site's forum. However I have to have the opacity set to zero to achieve this. That means the file's location can't be seen by the visitor.

What I would like to do is somehow copy the text of the file's location from the ID of the type="file" input and have it update to a input type="text" so visitors can see the location of their file. Since it will be a regular text field I can modify the CSS accordingly. I'm still working on the styling so I'll post all the code for everyone else who is interested when I've cleaned up the variable names and whatnot. :mrgreen:

Re: Copy browse button's file URL to different text input?

Posted: Sun Feb 10, 2008 8:22 pm
by JellyFish
In order to accomplish what you want you will need to use javascript.

Code: Select all

 
<input type="file" id="foo" />
<input type="text" id="bar" />
 
<script type="text/javascript">
document.getElementById("foo").onchange = function(){
document.getElementById("bar").value = document.getElementById("foo").value;
}
</script>