Upload multiple files with php

by  
Share:
Upload multiple files with php

In my last two article you have seen how to upload an image with php and add/remove multiple text fields using jquery. In this article you will learn how I have combined both these features into one i.e Uploading multiple files using php(of course you can filter images, documents based on your requirement). Also included is the trick to extend the file upload size so user can upload files larger than 128M/2M (local/online server) which is set by default.

Scope of this script?

Using this script user can upload one or multiple files. Extend the upload limit, by default the maximum upload size limit is 128mb on local server and 2mb/8mb on online server (it may vary from server to server).

Method 1: File field with multiple attribute tag

This is the first technique, it’s very easy and simple. What you have to do is just setup a form and add a file field, add this attribute to that file field (multiple=”multiple”). Also add an array symbol with file name, make sure you have a submit button and that’s it. Rest of the work will be done by the PHP script. Whenever you attach a file you can now select multiple files and attach to it.

<form name="f" action="index.php" method="post" enctype="multipart/form-data">
  <div style="width: 380px; margin: 0 auto;">
  <fieldset>
   <legend>Demo1</legend>
     Attach multiple Files:
     <input class="files" name="user_files[]" type="file" multiple="multiple" >
     <div class="height10"></div>
     <div><input type="submit" class="submit" name="sub" /> </div>
   </fieldset> 
</form>

Method 2: Multiple file field with jquery

In this method you can add/remove as many file fields with jquery, just make sure that every field name must be same and have an array symbol with it i.e closed with double square bracket []. In case you don’t know how to add/remove multiple fields checkout my last blog about adding/removing multiple text field with query.

<input class="files" name="user_files[]" type="file" >
<span><a href="javascript:void(0);" class="add" >Add More</a></span>

<!-- In this container dynamic fields will display -->
<div class="contents"></div>

<script src="jquery-1.9.0.min.js"></script>
<script>
$(document).ready(function() {
  $(".add").click(function() {
    $('<div><input class="files" name="user_files[]" type="file" ><span class="rem" ><a href="javascript:void(0);" >Remove</span></div>').appendTo(".contents");
    });
  $('.contents').on('click', '.rem', function() {
    $(this).parent("div").remove();
  });

});
</script>

Uploading the files with php

Now that you are done setting up with form move on with the final step i.e writing PHP script that will be executed when the form is submitted. Have in mind that the file is an array ( $_FILE[“file_name”] ) and since you are uploading multiple files so now its an array of arrays.

<?php
if (count($_FILES["user_files"]) > 0) {
  $folderName = "uploads/";
  $counter = 0;
  for ($i = 0; $i < count($_FILES["user_files"]["name"]); $i++) {
    if ($_FILES["user_files"]["name"][$i] <> "") {

      $ext = strtolower(end(explode(".", $_FILES["user_files"]["name"][$i])));
      $filePath = $folderName . rand(10000, 990000) . '_' . time() . '.' . $ext;

      if (!move_uploaded_file($_FILES["user_files"]["tmp_name"][$i], $filePath)) {
         $msg .= "Failed to upload" . $_FILES["user_files"]["name"][$i] . ". <br>";
         $counter++;
       }
    }
    $msg = ($counter == 0) ? "Files uploaded Successfully" : "Erros : ".$msg;
  }
}
?>

In case you have to upload larger files try changing these from your php.ini file(if you have access to it)
make them equal size
post_max_size = 128M
upload_max_filesize = 128M

In case you dont have access to php.ini file try writing these two lines at the top of your page.
<?php
ini_set('post_max_size', '128M');
ini_set('upload_max_filesize', '128M');
?>

Download

Get the latest updates directly in your inbox for FREE: Subscribe here

Share your feedback / let me know your doubts regarding this tutorial in the comment box given below.

Share:
Hasan

Shahrukh Khan (Hasan)

A software engineer who's a die-hard coder, blogger, dreamer and mentor with years of expertise in web development. Know more...

Related Posts

dennsi on

Link not found ??

Reply
Shahrukh Khan on

download link is updated. please click the download button at the end of the article.

Reply
Bharath on

How can i download this

Reply
Shahrukh Khan on

download link is updated. please click the download button at the end of the article.

Reply
Jake on

Sir, can you convert the file into laravel?

Reply
Shahrukh Khan on

no. you have to do it yourself

Reply
Jake on

and can you add the download file?

Reply
Shahrukh Khan on

the download link is given at the end of the tutorial.

Reply

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.