How to upload multiple files with PHP
Updated: 18-Jan-2022 / Tags: PHP Tutorials / Views: 2044 - Author: George
Introduction
Hello everyone,
in this post we are going to see,
how easy it is to select and upload multiple files to the server with php.
Sometimes we want to make things easier for our users, and we want to give them the option to upload multiple files at once,
but when it comes to it, we think that this must be a very difficult task.
Its not, take a look at the script bellow and find out for yourself.
Files needed
- We are going to create two files, and a folder.
- An index.php file for our html code, this is the page we load in the browser.
- And a script.php file, where we write our php code to handle the files.
- And in the same project folder ./root/, we need an uploads folder where we will store the files.
The HTML file
Lets take a look at our html code.
In the first line in our file we have to include the script.php file so we can have access to it.
We do that with the require() function. Now every time the index.php is loaded in the browser,
the php file will run to.
<?php require("script.php"); ?>
<!DOCTYPE html>
Inside the body tags we are going to have our upload form.
In line 13 where we have our opening form tag, we see that the action="" attribute is empty, that means that the form will be submitted to the same page. That's why we included the script.php file in the top of the page.
Next we are gonna use the http post method, method="post". And the important thing here is the enctype="multipart/form-data" attribute. When we uploading files the enctype attribute must always be set to "multipart/form-data", else the upload process will not work.
<body>
<!-- Upload form -->
<form action="" method="post" enctype="multipart/form-data">
<h1> Select the files you want to upload </h1>
<input type="file" name="files[]" multiple >
<button type="submit" name="upload">Upload files</button>
</form>
-
In line 15 we have the choose file button. When we want to select multiple files
we have to include the multiple attribute, which will us allow to, (as you guessed), select more than one file.
And it is very important to set an array, as value, in the name attribute name="files[]". Here the name attribute holds an array called files[].
The array will hold all of our selected files, and so we can access them in the php file. - And in line 17 we have our submit button.
The php code
In this script i am showing the basic process on how to access the files and storing them in a folder, we don't validate them. If you want to use this script in production, you must first validate the files.
Now lets take a look at the php code.
Firs of all in line 2 we are checking if there where any files uploaded.
The ['files'] key that we are checking, is the input file name attribute that we set
to an array, name="files[]".
<?php
if(isset($_FILES['files'])){
$folder = "uploads/";
$names = $_FILES['files']['name'];
$tmp_names = $_FILES['files']['tmp_name'];
$upload_data = array_combine($tmp_names, $names);
foreach ($upload_data as $temp_folder => $file) {
move_uploaded_file($temp_folder, $folder.$file);
}
}
- In line 3 we are setting our path to the uploads folder in a variable called $folder.
-
In line 5 we store all the names of the files we selected, in a variable called $names, which is an array.
Let me explain:
The $_FILES variable holds a multidimensional array. That means that each file property is an array which holds the associated values.Ex. lets say we choose two files with names "cars.jpg", and "bikes.png". Now the name property ['files']['name'] holds those two image names. The size property is holding the images sizes ['files']['size'] and so on.
So in line 5 and 6 we have two variables $names and $tmp_names which are holding the file names and the temporary stored locations. Hope it makes sense.This is how the $_FILES looks like when multiple files are selected. Every property is an array.
$_FILES = [ 'files' => [ 'name' => ['cars.jpg', 'bikes.png'], 'type' => ['image/jpg', 'images/png'], 'tmp_name' => ['/tmp/phpsw3jXq', '/tmp/php4kbqhq'], 'error' => [0, 0], 'size' => [268212, 95126] ] ];
Now we have to combine those two arrays, $names and $tmp_names into one.
$upload_data = array_combine($tmp_names, $names);
-
array_combine ... this function merges two arrays. The function takes two indexed arrays as arguments, and
returns an associative array, with keys the values of the first array, and values the values of the second array.
This is what the $upload_data array holds
$upload_data = [ '/tmp/phpY4X51O' => '01.png', '/tmp/phpQkEOSN' => '02.png' ];
Now we have to loop trough the $upload_data array and move the files in our uploads folder.
foreach ($upload_data as $temp_folder => $file) {
move_uploaded_file($temp_folder, $folder.$file);
}
- Inside the loop in line 11 we use the move_uploaded_file function to take the files from the temporary locations where php has stored our files, and move them in our uploads folder.
- The move_uploaded_function takes as the first argument the temporary location, ( that will be the keys ) of the $upload_data array, and the second argument is the path to the uploads folder.
Summary
Basic stuff to take away is:
In the html input button we have to specify the multiple attribute, and in the name attribute we have to set the value to an array name="files[]".
The $_FILES superglobal is a multidimensional array. That means that every property holds also an array.
The array_combine() function takes two arrays and merges them. The result is an associative array with keys the values of the first array, and values, the values of the second array.
Source code
You can download the source code and use it in any way you like.
Times downloaded: 603
Comment section
You can leave a comment, it will help me a lot.
Or you can just say hi. 😉