Tek-Tips is the largest IT community on the Internet today!
Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!
-
Congratulations strongm on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!
input type=file 1
- Thread starter shultz
- Start date
-
1
- #2
NO you can't change the style of the real browse button, but there is a workaround! 
Set the style of the <input> tag to 'display:none' and make a fake button and inputfield that will do the work
Try this example !! The only disadvantage is that you are not allowed to change the location of the file to be uploaded simply by editing the value of the text field (that's why its DISABLED attribute is set).
<HTML>
<HEAD>
<TITLE>Customizing INPUT TYPE=FILE Appearance</TITLE>
</HEAD>
<BODY>
<INPUT TYPE="file" ID="fileUpload" STYLE="display:none"
onChange="textFilename.value = this.value;">
<INPUT TYPE="text" ID="textFilename" STYLE="FONT-FAMILY:arial;FONT-SIZE:9pt"
SIZE="40" DISABLED>
<INPUT TYPE="button" ID="btnBrowse" STYLE="FONT-FAMILY:arial;FONT-SIZE:9pt;
BACKGROUND-COLOR:lightblue" onClick="fileUpload.click()"
VALUE="Choose a File">
</BODY>
</HTML>
Hope this helps,
Erik <-- My sport: Boomerang throwing !!
!! Many Happy Returns !! -->
Set the style of the <input> tag to 'display:none' and make a fake button and inputfield that will do the work
Try this example !! The only disadvantage is that you are not allowed to change the location of the file to be uploaded simply by editing the value of the text field (that's why its DISABLED attribute is set).
<HTML>
<HEAD>
<TITLE>Customizing INPUT TYPE=FILE Appearance</TITLE>
</HEAD>
<BODY>
<INPUT TYPE="file" ID="fileUpload" STYLE="display:none"
onChange="textFilename.value = this.value;">
<INPUT TYPE="text" ID="textFilename" STYLE="FONT-FAMILY:arial;FONT-SIZE:9pt"
SIZE="40" DISABLED>
<INPUT TYPE="button" ID="btnBrowse" STYLE="FONT-FAMILY:arial;FONT-SIZE:9pt;
BACKGROUND-COLOR:lightblue" onClick="fileUpload.click()"
VALUE="Choose a File">
</BODY>
</HTML>
Hope this helps,
Erik <-- My sport: Boomerang throwing !!
!! Many Happy Returns !! -->
Found another one too
DeZiner
Never be afraid to try something new.
Remember that amateurs built the Ark.
Professionals built the Titanic
DeZiner
Never be afraid to try something new.
Remember that amateurs built the Ark.
Professionals built the Titanic
- Thread starter
- #4
- Status
Similar threads
- Locked
- Question
