Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people, just like you, are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
Solved

How do I put an image instead of the Browse button when using <INPUT type=file ?

Posted on 2001-07-25
10
182 Views
Last Modified: 2008-02-20
How do I put an image instead of the "Browse" button when using <INPUT type=file ... ?

or

 I tried to use the click method in order to open the "Browse" button on the <INPUT type=file ...> control. Well, it did open but when I tried to submit the form using either the submit() method or using <INPUT type=submit  ...> control I got a javascript error "Access denied".
How can I put a value in the <INPUT type=file ...> without having to manualy type in the path or manualy clicking on the "Browse" button ?
0
Comment
Question by:yohuy
  • 4
  • 3
  • 2
  • +1
10 Comments
 
LVL 19

Accepted Solution

by:
DreamMaster earned 75 total points
ID: 6321004
You can't...the problem with this <input type=file is that it is a control that allready has the browse button along with it...You cannot change it unless you customize all of it and that would be way too much work for what it actually does..

Cheers,
Max.
0
 
LVL 53

Expert Comment

by:COBOLdinosaur
ID: 6321560
Any attempt to customize that I have seen actually change the browse button ends up with a non-functional browse button and in most cases the form is broken any way.

The browse button cannot be modified for security reason.  if it could be disquised, it would be a way for thieves to fool users into uploading files.

Cd&
0
 
LVL 19

Expert Comment

by:DreamMaster
ID: 6321581
Exactly Cd&,

Security with these kinds of things is very strict, for the same reason it is not possible to select a file for it using scripting....as it would allow someone to auto send a file from your harddisk to their own...

Max.
0
Free Tool: Site Down Detector

Helpful to verify reports of your own downtime, or to double check a downed website you are trying to access.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

 
LVL 2

Expert Comment

by:psogaa
ID: 6321726
You can hide the original input form with style...then the rest is up to javascript...something like this:

<html>
<head>
<title></title>
<script language="JavaScript">
function browse(){
  testForm.filetext.click();
  testForm.filetext2.value = testForm.filetext.value;
}
</script>
</head>
<body>
<form name=testForm>
  <input type=file name=filetext style="visibility:hidden"><br>
  <input type=text name=filetext2><a onclick="browse();">This could be an image</a>
</form>
</body>
</html>
0
 
LVL 2

Expert Comment

by:psogaa
ID: 6321734
bah, sorry...didn't read your question through :/ i guess you already tried that..
0
 
LVL 53

Expert Comment

by:COBOLdinosaur
ID: 6351887
yohuy,

The name of this site is experts-EXCHANGE because we exchange information.  You are serious about solving your problem, you need to participate by responing to the comments.  If you treat this like a new group, or the amateur forums, you will probably not get very good results.  We solve problems with dialog no one has posted in over a week because you have not responded, and it is not going to be taken seriously.

Cd&
0
 
LVL 53

Expert Comment

by:COBOLdinosaur
ID: 6537532
To close this out, I will be making a recommendation to CS
in about a week.  I would appreciate any comments from the
participants on how it should be disposed of.

Cd&
0
 
LVL 53

Expert Comment

by:COBOLdinosaur
ID: 6616352
It is time to clean this abandoned question up.  

I am putting it on a clean up list for CS.

<recommendation>

Points to DreamMaster
</recommendation>

If anyone participating in the Q disagrees with the recommendation,
please leave a comment for the mods.

Cd&
0
 
LVL 1

Expert Comment

by:Computer101
ID: 6616697
Comment from DreamMaster accepted as answer.

Thank you
Computer101
Community Support Moderator
0
 
LVL 19

Expert Comment

by:DreamMaster
ID: 6618449
Thanks Computer101 :)
0

Featured Post

Free Tool: IP Lookup

Get more info about an IP address or domain name, such as organization, abuse contacts and geolocation.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

The article shows the basic steps of integrating an HTML theme template into an ASP.NET MVC project
When crafting your “Why Us” page, there are a plethora of pitfalls to avoid. Follow these five tips, and you’ll be well on your way to creating an effective page.
In this tutorial viewers will learn how add a scalable full-width header using CSS3. Create a new HTML document with an internal stylesheet. Set a tiled background.:  Create a new div and name it Header. Position it with position:absolute at the top…
The viewer will learn how to create a basic form using some HTML5 and PHP for later processing. Set up your basic HTML file. Open your form tag and set the method and action attributes.: (CODE) Set up your first few inputs one for the name and …

861 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question