Solved

Input File Accept Tag

Posted on 2006-11-28
8
7,589 Views
Last Modified: 2013-11-19
Hi guys,

How would I change this tag so that it only accepts *.doc files?

<input name='myFile' type='file' />
0
Comment
Question by:Cyber-Drugs
[X]
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
  • 2
  • 2
  • 2
  • +2
8 Comments
 
LVL 10

Expert Comment

by:ADSLMark
ID: 18029185
On the bottom of this page this is explained:

http://www.cs.tut.fi/~jkorpela/forms/file.html

There is a default tage accept="" for the <input> tag, but i tried it with FF and IE and both did not work... So you probably need javascript.. which is explained on the website i gave you..

Mark
0
 
LVL 12

Expert Comment

by:enachemc
ID: 18029209
<input name='myFile' type='file' accept="image/*"/>

but this does not work on all browsers: http://www.cs.tut.fi/~jkorpela/forms/file.html#filter
0
 
LVL 12

Expert Comment

by:jessegivy
ID: 18029436
Welll....  A solution that doesn't work on all browsers isn't really a solution is it?  The javascript validation is a good idea, you could just parse the last three letters of the filename and then not submit the form if it isn't a .doc file, showing an alert box prompting them to select a word document instead.  Might be friendly to display the file extension they're using that's being rejected as well.

I'm baffled that the accept attribute doesn't work, it really pisses me off to be honest, I mean what's the point if it doesn't do what it's supposed to.   ...anyway, the javascript would look like this:

<html>
<head>
<title>Validation Example</title>
<script type="text/javascript">
function validateForm()
{
   var io=document.getElementById("fileIO");
   if(io.value.substring(io.value.length-3)!="doc")
   {
       alert(io.value.substring(io.value.length-4)+" is not a valid file extension.  The file must be a MS Word Document(.doc)");
       return false;
   }
   //if(another element isn't valid)
   //return false;
   //etc....
}
</script>
</head>
<body>
<form onsubmit="validate();">
<input type="file" id="fileIO" />
</form>
</body>
</html>

...please do note that there is no script access given to the value attribute of an input type="file" element.
0
Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
LVL 12

Expert Comment

by:jessegivy
ID: 18029446
...sorry, that last line was just to say that the value attribute is readonly, you just can't change it in script.
0
 
LVL 4

Author Comment

by:Cyber-Drugs
ID: 18045718
At the moment I am already doing a check to see if the selected file is *.doc or not, but what I am really after is a way to manipulate the form to only allow users to select *.doc files...
0
 
LVL 19

Accepted Solution

by:
DreamMaster earned 500 total points
ID: 18053722
Hi Cyber-Drugs,

What you are asking would require to change the way the input type="file" works. The dialog box that opens is totally beyond your control, so there's no way to have the user only be able to select .DOC files. The only way to block other files is to check that using javascript or server side code. I know that is not what you want to hear, but it's true nonetheless.

Regards,
Max.
0
 
LVL 4

Author Comment

by:Cyber-Drugs
ID: 18053770
Hi Max,

I just wanted to know if it was possible and if so, how I could do it. If it's not possible, that's fine, I may just create a Flash version, which gives me full control.

Cheers!
0
 
LVL 19

Expert Comment

by:DreamMaster
ID: 18053871
Glad to have been helpful :)

Regards,
Max.
0

Featured Post

Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

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

Suggested Solutions

Title # Comments Views Activity
HTML auto refresh to another site 4 45
HTML editor custom button 3 84
Increase image taller on inner pages 2 50
isNaN issue on the Table input text 2 40
This is a PowerShell web interface I use to manage some task as a network administrator. Clicking an action button on the left frame will display a form in the middle frame to input some data in textboxes, process this data in PowerShell and display…
Find out what you should include to make the best professional email signature for your organization.
In this tutorial viewers will learn how to style a corner ribbon overlay for an image using CSS Create a new class by typing ".Ribbon":  Define the class' "display:" as "inline-block": Define its "position:" as "relative": Define its "overflow:" as …
This tutorial will teach you the core code needed to finalize the addition of a watermark to your image. The viewer will use a small PHP class to learn and create a watermark.

737 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