PHP uploading multiple images and inserting into database

Question

i want the user to be able to upload multiple images. Is there a way to store the paths of say 3 images under one field in the database? I mean having all of the image paths in the same column like so

Images                                                     | date                                                                               
images/file1.jpg, images/file2.jpg, images/file3.jpg       | Thursday...

<ul id="image_upload">
    &lt;input type="file" name="image[]"&gt;&lt;a href="#" id="add_more">Add more</a> <br>
     [removed]
      $(document).ready(function(){
       $('#add_more').click(function(){
        var current_count = $('input[type="file"]').length;
        var next_count = current_count + 1;
        $('#image_upload').append('<br>&lt;input type="file" name="image[' + next_count + ']"&gt;&lt;br>');
       });
      });



    </ul> <br><br>

then i check the files with php and attempt to insert to the database

if (!empty($_FILES['image'])){  
  for ($i = 0; isset($_FILES['image']['name'][$i]); $i++) {
   $allowed = array('jpg', 'jpeg', 'png', 'bmp', 'tiff', 'gif');
   $fileName = $_FILES['image']['name'][$i];
   $fileSize = $_FILES['image']['size'][$i];
   $fileExt = strtolower(pathinfo($fileName, PATHINFO_EXTENSION));

   if (!in_array($fileExt, $allowed)) {
    $errors[] = 'Incorrect file type. Only allowed: ' . implode(', ', $allowed) . '';
   }
   if ($fileSize > 2097152) {
    $errors[] = "$fileName exceeds the maximum file size of 2 MB";
   }
  }

  for ($i = 0; isset($_FILES['image']['name'][$i]); $i++) {
   $fileBase = basename($_FILES['image']['name'][$i]);
   $fileName = pathinfo($fileBase, PATHINFO_FILENAME);
   $fileExt = pathinfo($fileBase, PATHINFO_EXTENSION);
   $fileTmp = $_FILES['image']['tmp_name'][$i];
   $fileDst = 'images/images/'.basename($_FILES['image']['name'][$i]);
   for ($j = 0; file_exists($fileDst); $j++) {
    $fileDst = "images/images/$fileName-$j.$fileExt";
   }
   if (move_uploaded_file($fileTmp, $fileDst)) {
    $output[$fileBase] = "Stored $fileBase OK";
   } 
  }
 }

this code only uploads the first image to the temp folder and only one path into the database

use var_dump() or print_r() to know what exactly you have in the $_FILES variable — ɹɐqʞɐ zoɹǝɟ
– ɹɐqʞɐ zoɹǝɟ, Commented Feb 14, 2014 at 6:37
comma or a pipe separated value will do it for you..make sure you parse it when you want to use it — HIRA THAKUR
– HIRA THAKUR, Commented Feb 14, 2014 at 6:37

HIRA THAKUR · Accepted Answer · 2014-02-14 06:48:53Z

2

Upload all images at once :

<form method="post" action="" enctype="multipart/form-data" id="frmImgUpload">
    <input name="multiple_uploaded_files[]" type="file" multiple="true" />
</form>

foreach ($_FILES['multiple_uploaded_files']['name'] as $file)
    {
        print_r($file);
        //use the move_uploaded_file() to move your file on your server directory.

        //fire an insert query that inserts all the file names with comma separated value
    }

IF you want the user to upload images separately,one by one :

<input type="file" name="uploaded_file[]" id="file" >
<input type="file" name="uploaded_file[]" id="file" >
<input type="file" name="uploaded_file[]" id="file" >

foreach ($_FILES['uploaded_file']['name'] as $file)
        {
            print_r($file);
            //use the move_uploaded_file() to move your file on your server directory.
            //fire an insert query that inserts all the file names with comma separated value
        }

edited Feb 14, 2014 at 6:48

answered Feb 14, 2014 at 6:42

HIRA THAKUR

17.8k14 gold badges60 silver badges87 bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

user3233664 Over a year ago

but that way you can select multiple at once from the browse window where as i want the user to manually to upload one by one

HIRA THAKUR Over a year ago

well than have multiple input type=file..it doesnt get simpler

user3233664 Over a year ago

okay i guess i could do that and to have an Add more button ill just hide the reset of the inputs and add one by one on each click right?

user3233664 Over a year ago

okay that seemed to work. now once they are in the database i just call them like so <img src="$file"> and loop until all loaded?

HIRA THAKUR Over a year ago

naaa..you need to parse the string you stored..coz you are storing multiple file names in one field.So when you get the string...explode() the string with your separator..and store it in an array.then loop over it

|

Amal · Accepted Answer · 2014-02-14 12:18:57Z

1

You just remove the index from dynamic file elements, like so:

$(document).ready(function(){
    $('#add_more').click(function(){
        $('#image_upload').append('<br><input type="file" name="image[]" />');
    });
});

There is no need to provide the indexing. Just provide an array symbol [] only. Your problem here is that you've given an index of 2 to the first dynamic file. So the file array indexes becomes 0, 2, 3 etc, so the loop will fail to iterate properly.

edited Feb 14, 2014 at 12:18

Amal

76.8k18 gold badges133 silver badges154 bronze badges

answered Feb 14, 2014 at 6:43

Sherin Jose

2,5263 gold badges20 silver badges39 bronze badges

2 Comments

user3233664 Over a year ago

when i did print_r($fileDst); i only got one image path

Sherin Jose Over a year ago

The index of the first file element is 0. Then next must be 1. But as per your jquery you given it 2. Then in your for loop condition second iteration becomes false. So only one image is uploaded

apolev · Accepted Answer · 2014-02-14 06:59:29Z

Is there a way to store the paths of say 3 images under one field in the database?

There are at least 3 ways for doing it:

Serialize PHP array before save it into your database and unserialize after select.
Save them as a string with some separator (for example: path1||path2||pathX). Implode and explode functions would be helpful.
If you are using PostgreSQL you can just use array datatype. So you will be able to manipulate them in SQL (counting, change one of them to another etc.).

But I think it's not a better way for solving this issue. Because now you want to save only a path, after a couple of days you might want to add some extra data like an ALT text, title, description, size, path to small preview etc.

So using some "user_images" table would be more convenient.

Amal · Accepted Answer · 2014-02-14 12:15:06Z

0

If you just want to store the paths, I would take a look at serialize() and unserialize(). They are made to create storeable representations of data.

edited Feb 14, 2014 at 12:15

Amal

76.8k18 gold badges133 silver badges154 bronze badges

answered Feb 14, 2014 at 6:39

CommandZ

3,6331 gold badge25 silver badges28 bronze badges

Collectives™ on Stack Overflow

PHP uploading multiple images and inserting into database

4 Answers 4

Upload all images at once :

IF you want the user to upload images separately,one by one :

6 Comments

2 Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Upload all images at once :

IF you want the user to upload images separately,one by one :

6 Comments

2 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related