Solved

<input type=file> restricting types of files, default directory

Posted on 2001-07-09
6
3,228 Views
Last Modified: 2012-08-13
Hi all,
Two questions:

1.
To restrict the types of files a user can select using <input type=file>, I set the following property: (e.g.) accept="image/*". This should, supposedly, only list images in the file browser box when you click Browse. Except it doesn't, it always lists all files. I'm using IE 5.5 on Win2K. Is this a Netscape property? What am I doing wrong?

2.
Is it possible to open the file browser box in a certain specified directory, it always seems to start in "my pictures" or something like this.

Cheers.
0
Comment
Question by:Musravus1
[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
  • 3
  • 2
6 Comments
 
LVL 19

Expert Comment

by:webwoman
ID: 6264447
You don't have ANY control over this on the client side. You can change what you're going to accept on the SERVER, but you can't change what they get or where they start on the CLIENT.

HUMONGOUS security hole if you could.
0
 

Author Comment

by:Musravus1
ID: 6264517
That makes sense of course if you think about it, although I can't really see why specifying that the file browser box should only list files of type "image" is a huge security risk.

In the meantime I have found out that most browsers don't support the "accept" property although it has been out there for a long time.

Does anyone know if IE6 has found a nice way to deal with this problem?
0
 
LVL 53

Expert Comment

by:COBOLdinosaur
ID: 6264701
I have not done much with IE 6 beta yet, but the direction is toward higher levels of privacy protection which means more restrictive security, not less.

As developers we find the security elements to be a limitation, but from the users side the security concerns get raised with every new hack attack, and the browsers are designed for users not developers.

Cd&
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 53

Accepted Solution

by:
COBOLdinosaur earned 100 total points
ID: 6265946
This is a filter I did a while ago.  It might help. It doesn't prevent the
user from selecting the wrong file type, but it does prevent them from
submitting anythin with the wrong extension.

<head>
   <title> file type filter </title>
<style>
   body {background-color:blue;color:lightyellow;border:5px outset red}
   #prompt {padding:10;background-color:blueviolet;color:floralwhite;
            width:250}
   .container {width:250;background-color:brown;color:peru;
               border:3px outset burlywood}
   .file {background-color:deepskyblue;colorcadet:blue;
          border-color:lightsteelblue}
   .sbutton {background-color:dimgray;color:pink;border-color:dodgerblue}
</style>
<script language="JavaScript">
<!--
   var fileType = new Array(".gif", ".jpg", ".png");
   var arrayList="File Types: ";
   for (i=0;i<fileType.length;i++)
      { arrayList+=fileType[i]+" "; }
   var uploadOK=false;
   function filterFiles(thesource,thefile)
   {
      uploadOK = false;
      if (thefile)
      {
         while (thefile.indexOf("\\") != -1)
         {
            thefile = thefile.slice(thefile.indexOf("\\") + 1);
         }
         ftype = thefile.slice(thefile.indexOf(".")).toLowerCase();
         for (i=0;i<fileType.length;i++)
         {
            if (fileType[i]==ftype)
            {
               uploadOK=true;
            }
         }
      }
      if (uploadOK)
      {
         thesource.submit();
         alert('submitted');
      }
      else
      {
         alert(arrayList+' only please');
      }
   }
//  End -->
</script>
</head>
<body>
<h1 align="center"> File Upload Filter</h1>
<p> With this script you can set the file extensions that are acceptable
    for uploading and the user will be prompted with the list.  When
    they select a file and submit, the extention will be validated and
    either the submit will be executed for the user will get an alert.
</p>
<br><br>
<div align="center">
<script language="JavaScript">
<!--
document.write('<div align="center" id="prompt"> Upload '+arrayList+ '</div>');
// -->
</script>
<div align="center" class="container">
<form method="post" name="myform">
   <input type="file" name="myfile" class="file">
   <br><br>
   <input type="button" name="Submit" value="Submit" class="sbutton"
      onFocus="this.blur()"
      onClick="filterFiles(document.myform,document.myform.myfile.value);return false">
</form>
</div>
</div>
</body>
</html>
0
 

Author Comment

by:Musravus1
ID: 6268248
Thanks, that will do the trick for now. I'm planning into turning this into a signed applet (don't worry, it's an intranet application) which will do most of the stuff I want, I just needed to know the alternatives.

I'll abandon the "default directory" idea, it makes sense you can't prescribe this on a client machine you know nothing about.
0
 
LVL 53

Expert Comment

by:COBOLdinosaur
ID: 6268896
At least with an intranet you have some consistency with the client environment, unlike the Internet where the user variations ar almost infinite.

Cd&
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
Embedding Tags in a restricted UI 6 31
JavaScript Loan Calculator Error 3 34
href return to normal window 5 29
Display Flex does not Wrap Items 2 8
Find out what you should include to make the best professional email signature for your organization.
Finding original email is quite difficult due to their duplicates. From this article, you will come to know why multiple duplicates of same emails appear and how to delete duplicate emails from Outlook securely and instantly while vital emails remai…
In this tutorial viewers will learn how to position overlapping items using z-index in CSS. They will also learn the restrictions on the z-index property.  Create a new HTML document with an internal stylesheet.: Create a div in CSS and name it Red.…
In this tutorial viewers will learn how to style elements, such a divs, with a "drop shadow" effect using the CSS box-shadow property Start with a normal styled element, such as a div.: In the element's style, type the box shadow property: "box-shad…

749 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