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

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

Posted on 2001-07-09
6
3,201 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
  • 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
Active Directory Webinar

We all know we need to protect and secure our privileges, but where to start? Join Experts Exchange and ManageEngine on Tuesday, April 11, 2017 10:00 AM PDT to learn how to track and secure privileged users in Active Directory.

 
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

Free Tool: Postgres Monitoring System

A PHP and Perl based system to collect and display usage statistics from PostgreSQL databases.

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

Suggested Solutions

Title # Comments Views Activity
Easy responsive table out of existing table 28 60
Save ms data to server side. 19 55
Index on a Table 6 25
Asp in server side with Mssql Server 7 4 27
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…
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 to embed videos in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: "<!DOCTYPE html>": Use the <video> tag to insert a video. Define the src as the URL of your video; this is similar to …
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)

828 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