Multiple files upload with unique html input file

PHP
1

Hi everybody,

I have done this code for uploading files.
The script goes perfect for upload only one file.
I have added in the html multiple=true, but, how can I retrieve the list of files selected and then using them in $_FILES and then proceed to a right multiple upload?

This is my code:


<?php
   function upload_file($arg_input_file_name_upload,
                         $arg_dest_folder) {


       create_folders($arg_dest_folder);

       $file_tmp_name = $_FILES["{$arg_input_file_name_upload}"]['tmp_name'];
       $file_name = $_FILES["{$arg_input_file_name_upload}"]['name'];

       if (move_uploaded_file($file_tmp_name, $arg_dest_folder . $file_name))
         return 1;
       else
         return 0;
    }


   $self = $_SERVER['PHP_SELF'];
   $frm_submit = isset($_POST['frm_submit']) ? $frm_submit = $_POST['frm_submit'] : "";

   if ($frm_submit != "") {
      print_r($_FILES['myfile'][0]);

      $ret_uploaded = upload_file('myfile', '../public/prova_cartella/');


      if ($ret_uploaded == 1)
         echo "UPLOAD OK!";
      else if ($ret_uploaded == 0)
         echo "UPLOAD ERROR!";
   }

   echo "<html>";
   echo "<body>";

   echo "<form method='post' action=$self enctype='multipart/form-data'>";
   echo "<input type='file' id='myfile' name='myfile' multiple='true'>";
   echo "<input type='submit' name='frm_submit' value='Upload'>";
   echo "</form>";

   echo "</body>";
   echo "</html>";
?>

I have also tried to retrieve the text within the ‘html file input’ through javascript but without success. I wanted to POST with the form that text and then work on it. Here the code I have tried:

echo "<input type='text' id='txt_file' name='txt_file'>";
   echo "<input type='button' name='to_text' value='to_text' onclick=\\"document.getElementById('txt_file').value = document.getElementById('myfile').value\\">";

I hope I have been clear in my explanation. Can you help me please? I am trying to do rightly this matter from long time :injured:

many thanks.

2

The file upload field does not have an attribute ‘multiple’. If you want to upload more than one file at the same time, you’ll need to add more inputs:


echo "<input type='file' id='myfile_1' name='myfile[]' multiple='true'>";   
echo "<input type='file' id='myfile_2' name='myfile[]' multiple='true'>";

Now $_FILES[‘myfile’] will be an array of uploaded files.

Also, you cannot access file type fields using Javascript. It’s a security thing :slight_smile:

3

Actually Firefox claims 3.6 supports the attribute multiple on file elements, this is what your looking for https://developer.mozilla.org/en/Using_files_from_web_applications

4

thanks to all.
The idea of the user Immerse is to select one file each time and then upload them all. No that’s not a wanted behaviour.
Actually what the user SgtLegend says is what I want. I will read the document linked with attention

But now I have another question. How someone can obtain the same the multi selection without setting multiple flag? see here:
http://digitarald.de/project/fancyupload/2-0/showcase/photoqueue-fixed/

thanks.

5

That uses Flash, and is probably something like swfupload.

I’ve uploaded swfupload on several sites, it works quite well.
Every file is still uploaded seperately, though.

6

I use uploadify works really good you can add a function into the script to do whatever you need to do with the uploaded file http://www.uploadify.com/

7

yes but, in uploadify, if i can’t ‘select on the fly’/choose the destination upload folder it’s useless for me :frowning:

8

You can do this, if you know your way around javascript you can set the uploadify settings on the fly by using a couple of different methods such as a drop down box or an alert box to change the upload path. I’m using uploadify in a commercial script im writing and it works great.

http://www.uploadify.com/documentation/ - Scroll down to uploadifySettings, the only downside to uploadify is that they have not one bit of support.

9

yes I know. see this http://www.uploadify.com/forum/viewtopic.php?f=7&t=6427. I have followed the same way but without success.

10

Could you please post the code you have, including the HTML input elements

11

yes, I have done in this way with success, but without the function uploadifySettings because I don’t understand how to use it
although I have followed the example in the documentation http://www.uploadify.com/documentation/.

I think that it would be better to select the upload folder in client side and not in server side with form submission

this is the code:

<?php
if (!isset($_GET['txtfile'])) {
   $_GET['txtfile'] = "";
}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Uploadify Example Script</title>
<link href="css/default.css" rel="stylesheet" type="text/css" />
<link href="css/uploadify.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="scripts/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="scripts/swfobject.js"></script>
<script type="text/javascript" src="scripts/jquery.uploadify.v2.1.0.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
    $("#uploadify").uploadify({
        'uploader'       : 'scripts/uploadify.swf',
        'script'         : 'scripts/uploadify.php',
        'cancelImg'      : 'cancel.png',
        'folder'         : '<?php echo $_GET["txtfile"] ?>',
        'queueID'        : 'fileQueue',
        'auto'           : true,
        'multi'          : true
    });
});
</script>
</head>
<body>
<form method='get' action="<?php echo $_SERVER['PHP_SELF'] ?>">
<input type='text' name='txtfile' value='my_folder'>
<input type='submit' value='CHANGE FOLDER'>
</form>
<div id="fileQueue"></div>
<?php
if ($_GET['txtfile'] == "") {
   echo "Please select upload folder.";
} else {
   echo '<input type="file" name="uploadify" id="uploadify">';
   echo '<p><a href="javascript:jQuery(\\'#uploadify\\').uploadifyClearQueue()">Cancel All Uploads</a></p>';
}
?>

</body>
</html>