Upload more than one image to a server folder

Question

I have a form through which a user can upload images to a server folder, and the path gets saved in the database.

Currently the code that I have works fine when the user has to input only one image; however, I want to do something like the following with the form, so that user can upload more than one image:

<form class="form-horizontal" role="form" action="insertimage.php?id=<?php echo $_GET['id']; ?>" enctype="multipart/form-data" method="post">
    <div class="col-md-6">
        <div class="form-group">
            <label class="col-lg-4 control-label">Select Image 1</label>
                <div class="col-lg-6">
                    <input  type="file" name="file" id="fileToUpload">
                </div>
        </div>
    </div> 

    <div class="col-md-6">
        <div class="form-group">
            <label class="col-lg-4 control-label">Select Image 2</label>
                <div class="col-lg-6">
                    <input  type="file" name="file1" id="fileToUpload">
                </div>
        </div>
    </div> 

    <div class="col-md-6">
        <div class="form-group">
            <label class="col-lg-4 control-label">Select Image 3</label>
                <div class="col-lg-6">
                    <input  type="file" name="file2" id="fileToUpload">
                </div>
        </div>
    </div> 

    <div class="col-md-6">
        <div class="form-group">
            <label class="col-md-3 control-label"></label>
                <div class="col-md-8">
                    <input class="btn btn-primary" value="Save Changes" type="submit" name="submit">
                </div>  
        </div>
    </div> 
</form>

The PHP code at back end for uploading one image is insertimage.php:

<?php
$file_exts = array("jpg", "bmp", "jpeg", "gif", "png");
$upload_exts = end(explode(".", $_FILES["file"]["name"]));
if ((($_FILES["file"]["type"] == "image/gif")
|| ($_FILES["file"]["type"] == "image/jpeg")
|| ($_FILES["file"]["type"] == "image/png")
|| ($_FILES["file"]["type"] == "image/pjpeg"))
&& ($_FILES["file"]["size"] < 2000000)
&& in_array($upload_exts, $file_exts))
    {
        if ($_FILES["file"]["error"] > 0)
            {
                echo "Return Code: " . $_FILES["file"]["error"] . "<br>";
            }
        else
            {
                echo "Upload: " . $_FILES["file"]["name"] . "<br>";
                echo "Type: " . $_FILES["file"]["type"] . "<br>";
                echo "Size: " . ($_FILES["file"]["size"] / 1024) . " kB<br>";
                echo "Temp file: " . $_FILES["file"]["tmp_name"] . "<br>";
                // Enter your path to upload file here
                if (file_exists("uploads/" .$_FILES["file"]["name"]))
                    {
                        echo "<div class='error'>"."(".$_FILES["file"]["name"].")"." already exists. "."</div>";
                    }
                else
                    {
                        move_uploaded_file($_FILES["file"]["tmp_name"],"uploads/" . $_FILES["file"]["name"]);
                        echo "<div class='sucess'>"."Stored in: " . "uploads/" . $_FILES["file"]["name"]."</div>";
    `               }
            }
    }
else
    {
        echo "<div class='error'>Invalid file</div>";
    }
?>

Can anyone please tell me how I can support uploading 3 images with help of the above code?

Answer 1

With this you are able to select multiple image with use of ctrl

 <input  type="file" name="file[]" id="fileToUpload" multiple />

On Server side use loop

 for ($1=0;i<count($dataFile);$i++){
    //your upload code ; 
    $_FILES["file"]["name"][$i];//go for each and every i position for all 
 }

Answer 2

You can use file array for multiple images at a time with multiple attribute in the html line like:

<input  type="file" name="file[]" id="fileToUpload" multiple />

This will give you the array of files which you can debug by

print_r($_FILES);

And you also have to change the code that saves the data as there is error that it can only have one file at a time try for loop my debugging with

$_FILES