Uploading multiple files

Php-mysql Course

HTML forms can also be used to get files from the user's computer in order to be uploaded on the server through a PHP script.
The HTML code for upload form field is:

<input type="file" name="field_name" />

This tutorial shows a script for uploading multiple files simultaneously to the server.
"The Secret" is the following: the value of the "name" attribute of upload fields must be the same, but with the Array type, with [] at the end of the name (like "field_name[]"), so the PHP script will receive a numeric array, named "field_name", with each element containing the data sent from one upload box. Then, the PHP script must traverse that Array to take and upload the file stored in each element, performing the necessary checks, such as size and type of each file.
Below is a script with the PHP code and a HTML form that can be used to upload multiple files on a server at the same time. Besides the basic checks (file type and size), the script has protection to awoid re-upload the files on a possible refresh.
- Other detailed explanations are added in the script code.

<?php
/*** Multi-Upload Script, from: https://coursesweb.net/php-mysql/ ***/
session_start();     // Enables the possibility of working with Sessions

$updir = 'upload';     // sets the folder
$max_size = 500;       // maximum file size allowed (in KB)

// file types allowed
$allowtype = array('bmp', 'flv', 'gif', 'jpg', 'jpeg', 'mp3', 'pdf', 'png', 'rar', 'zip');

$rezultat = array();     // Variable to store the messages that will be returned by the script

// If the folder from $updir not exists, attempts to create it (with CHMOD 0777)
if (!is_dir($updir)) mkdir($updir, 0777);

/** Code for. Uploading files to server **/

// If is received a valid file from the form
if (isset($_FILES['file_up'])) {
  // Traverse the array elements, with data from the form fields with name="file_up[]"
   // Check the files received for upload
  for($f=0; $f<count($_FILES['file_up']['name']); $f++) {
    $nume_f = $_FILES['file_up']['name'][$f];     // get the name of the current file

    // if the name has minimum 4 characters
    if (strlen($nume_f)>3) {
      // get and checks the file type (its extension)
      $type = end(explode('.', strtolower($nume_f)));
      if (in_array($type, $allowtype)) {
        // check the file size
        if ($_FILES['file_up']['size'][$f]<=$max_size*1000) {
          // if there aren't errors in the copying process
          if ($_FILES['file_up']['error'][$f]==0) {
            // Set location and name for uploading file on the server
            $thefile = $updir . '/'. $nume_f;
            // if the file can't be uploaded, returns a message
            if (!move_uploaded_file ($_FILES['file_up']['tmp_name'][$f], $thefile)) {
              $rezultat[$f] = 'The file '. $nume_f. ' could not be copied, try again';
            }
            else {
              // stores the name of the file
              $rezultat[$f] = '<b>'.$nume_f.'</b>';
            }
          }
        }
        else { $rezultat[$f] = 'The file <b>'. $nume_f. '</b> exceeds the maximum permitted size, <i>'. $max_size. 'KB</i>'; }
      }
      else { $rezultat[$f] = 'The file <b>'. $nume_f. '</b> is not an allowed file type'; }
    }
  }

  // To avoid resending data on refresh will do a redirect to itself, with re=up
  // Adding in a session takes messages returned by the script
  $_SESSION['rezultat'] = implode('<br />', $rezultat);
  header('Location: '. basename($_SERVER['PHP_SELF']). '?re=up');
}

// If $_GET['re'] and $_SESSION['rezultat'] are set, displays data from the session, then delete it
if (isset($_GET['re']) && isset($_SESSION['rezultat'])) {
  echo '<h4>Uploaded files:</h4>'. $_SESSION['rezultat'];
  unset($_SESSION['rezultat']);
}
?>
<!-- Form for multiple Upload fields -->
<form id="uploadform" action="<?php echo $_SERVER['SCRIPT_NAME']; ?>" method="post" enctype="multipart/form-data">
  <input type="file" class="file_up" name="file_up[]" /><br />
  <input type="file" class="file_up" name="file_up[]" /><br />
  <input type="file" class="file_up" name="file_up[]" /><br />
  <input type="file" class="file_up" name="file_up[]" /><br />
  <input type="file" class="file_up" name="file_up[]" /><br />
  <input type="submit" value="UPLOAD" id="submit" />
</form>

To can upload the files on the server, PHP must have write permission in the directory specified at the $updir variable.
- The form from this script has five upload inputs, you can add more fields or reduce their number. This script can work with one ore multiple upload fields.

First line ...<br>
Other line...

#id {
  letter-spacing: 2px;
}

var elm = document.getElementById("theID");
var content = elm.innerHTML;
alert(content);

echo "Address URL: http://CoursesWeb.net";