├── .DS_Store
├── README.md
├── config
    └── database.php
├── file-upload.php
└── index.php


/.DS_Store:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/SinghDigamber/php-multiple-file-upload/54edebd51cfb4eb487ff73f172a1ceca966f9a0f/.DS_Store


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | # php-multiple-file-upload
2 | PHP 7 Multiple Files and Images uploading tutorial, and we will learn to store uploaded files in the MySQL database along with some necessary file uploading validation.
3 | 
4 | [PHP 7 Multiple Files/Images Upload in MySQL Database](https://www.positronx.io/php-multiple-files-images-upload-in-mysql-database/) 


--------------------------------------------------------------------------------
/config/database.php:
--------------------------------------------------------------------------------
 1 | <?php
 2 | 
 3 |     $hostname = "localhost";
 4 |     $username = "root";
 5 |     $password = "";
 6 | 
 7 |     try {
 8 |         $conn = new PDO("mysql:host=$hostname;dbname=php_crud", $username, $password);
 9 |         // set the PDO error mode to exception
10 |         $conn->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
11 |         //echo "Database connected successfully";
12 |     } catch(PDOException $e) {
13 |         echo "Database connection failed: " . $e->getMessage();
14 |     }
15 | 
16 | ?>


--------------------------------------------------------------------------------
/file-upload.php:
--------------------------------------------------------------------------------
 1 | <?php 
 2 |     // Database
 3 |     include 'config/database.php'; 
 4 | 
 5 |     if(isset($_POST['submit'])){
 6 |         
 7 |         $uploadsDir = "uploads/";
 8 |         $allowedFileType = array('jpg','png','jpeg');
 9 |         
10 |         // Velidate if files exist
11 |         if (!empty(array_filter($_FILES['fileUpload']['name']))) {
12 |             
13 |             // Loop through file items
14 |             foreach($_FILES['fileUpload']['name'] as $id=>$val){
15 |                 // Get files upload path
16 |                 $fileName        = $_FILES['fileUpload']['name'][$id];
17 |                 $tempLocation    = $_FILES['fileUpload']['tmp_name'][$id];
18 |                 $targetFilePath  = $uploadsDir . $fileName;
19 |                 $fileType        = strtolower(pathinfo($targetFilePath, PATHINFO_EXTENSION));
20 |                 $uploadDate      = date('Y-m-d H:i:s');
21 |                 $uploadOk = 1;
22 | 
23 |                 if(in_array($fileType, $allowedFileType)){
24 |                         if(move_uploaded_file($tempLocation, $targetFilePath)){
25 |                             $sqlVal = "('".$fileName."', '".$uploadDate."')";
26 |                         } else {
27 |                             $response = array(
28 |                                 "status" => "alert-danger",
29 |                                 "message" => "File coud not be uploaded."
30 |                             );
31 |                         }
32 |                     
33 |                 } else {
34 |                     $response = array(
35 |                         "status" => "alert-danger",
36 |                         "message" => "Only .jpg, .jpeg and .png file formats allowed."
37 |                     );
38 |                 }
39 |                 // Add into MySQL database
40 |                 if(!empty($sqlVal)) {
41 |                     $insert = $conn->query("INSERT INTO user (images, date_time) VALUES $sqlVal");
42 |                     if($insert) {
43 |                         $response = array(
44 |                             "status" => "alert-success",
45 |                             "message" => "Files successfully uploaded."
46 |                         );
47 |                     } else {
48 |                         $response = array(
49 |                             "status" => "alert-danger",
50 |                             "message" => "Files coudn't be uploaded due to database error."
51 |                         );
52 |                     }
53 |                 }
54 |             }
55 | 
56 |         } else {
57 |             // Error
58 |             $response = array(
59 |                 "status" => "alert-danger",
60 |                 "message" => "Please select a file to upload."
61 |             );
62 |         }
63 |     } 
64 | ?>


--------------------------------------------------------------------------------
/index.php:
--------------------------------------------------------------------------------
 1 | <?php include("file-upload.php"); ?>
 2 | 
 3 | <!doctype html>
 4 | <html lang="en">
 5 | 
 6 | <head>
 7 |   <meta charset="utf-8">
 8 |   <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
 9 |   <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css">
10 | 
11 |   <title>PHP 7 Upload Multiple Files Example</title>
12 |   <style>
13 |     .container {
14 |       max-width: 450px;
15 |     }
16 |     .imgGallery img {
17 |       padding: 8px;
18 |       max-width: 100px;
19 |     }    
20 |   </style>
21 | </head>
22 | 
23 | <body>
24 | 
25 |   <div class="container mt-5">
26 |     <form action="" method="post" enctype="multipart/form-data" class="mb-3">
27 |       <h3 class="text-center mb-5">Upload Multiple Images in PHP 7</h3>
28 | 
29 |       <div class="user-image mb-3 text-center">
30 |         <div class="imgGallery"> 
31 |           <!-- Image preview -->
32 |         </div>
33 |       </div>
34 | 
35 |       <div class="custom-file">
36 |         <input type="file" name="fileUpload[]" class="custom-file-input" id="chooseFile" multiple>
37 |         <label class="custom-file-label" for="chooseFile">Select file</label>
38 |       </div>
39 | 
40 |       <button type="submit" name="submit" class="btn btn-primary btn-block mt-4">
41 |         Upload Files
42 |       </button>
43 |     </form>
44 | 
45 |     <!-- Display response messages -->
46 |     <?php if(!empty($response)) {?>
47 |         <div class="alert <?php echo $response["status"]; ?>">
48 |            <?php echo $response["message"]; ?>
49 |         </div>
50 |     <?php }?>
51 |   </div>
52 | 
53 |   <!-- jQuery -->
54 |   <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"></script>
55 | 
56 |   <script>
57 |     $(function() {
58 |     // Multiple images preview with JavaScript
59 |     var multiImgPreview = function(input, imgPreviewPlaceholder) {
60 | 
61 |         if (input.files) {
62 |             var filesAmount = input.files.length;
63 | 
64 |             for (i = 0; i < filesAmount; i++) {
65 |                 var reader = new FileReader();
66 | 
67 |                 reader.onload = function(event) {
68 |                     $($.parseHTML('<img>')).attr('src', event.target.result).appendTo(imgPreviewPlaceholder);
69 |                 }
70 | 
71 |                 reader.readAsDataURL(input.files[i]);
72 |             }
73 |         }
74 | 
75 |     };
76 | 
77 |       $('#chooseFile').on('change', function() {
78 |         multiImgPreview(this, 'div.imgGallery');
79 |       });
80 |     });    
81 |   </script>
82 | 
83 |   
84 | </body>
85 | 
86 | </html>


--------------------------------------------------------------------------------