1

I want to upload multiple images (total size of images is over 32 MB) by using 'jQuery' image 'uploader' plug-in and 'php'. How to do it? I tried via AJAX, but no data has been sent.

<form id="form" action="" method="post" enctype="multipart/form-data" >
<!--            <label for="gallery-type">Gallery Type</label>-->
<!--            <select class="form-group" name="gallery_type" id="gallery- 
type" style="width: 100px">-->
<!--                <option value="1">1</option>-->
<!--                <option value="2">2</option>-->
<!--                <option value="3">3</option>-->
<!--                <option value="4">4</option>-->
<!--            </select><br>-->
        <input class="form-group" type="file" name="images[]" style="width: 
200px" id="input" multiple>
<!--            <br>-->
        <input class=" form-group btn btn-default" type="submit" 
value="upload" name="upload">
    </form>

AJAX:

<script>
$('#input').change(function () {

    var form = $('#form');
    var formData = new FormData(form);

    $.ajax({
        url: 'lib/upload.php',
        type: 'post',
        data: formData,
        contentType: false,
        processData: false,
        cache: false,
        success: function (data) {
            $('#here').html(data);
        }
    });
});

and which returns forms upload.php

<?php include "../lib/functions.php"; ?>

if(isset($_FILES['images'])){

$images = $_FILES['images'];


$images = correct_files_array($images);

foreach($images as $image){

        echo "<form action='' method='post'>
                Form
                <input type='submit' name='upl' class='submit-form' value='upload this image'>
              </form><br>";
}

}else{
echo "is not set";
}
elki42
  • 127
  • 1
  • 10
  • You can use drop zone plugin. Check here https://github.com/enyo/dropzone – Vamsi Krishna Jun 08 '18 at 06:22
  • This is the first result for a quick google search for "ajax upload multiple files" https://stackoverflow.com/questions/19295746/how-to-upload-multiple-files-using-php-jquery-and-ajax – hungrykoala Jun 08 '18 at 06:49

1 Answers1

0

You just have to change this line from

var form = $('#form');

to

var form = $('#form')[0];

because To construct a FormData object you have to specify that form element when creating the FormData object.

Rakesh Sojitra
  • 3,318
  • 2
  • 14
  • 31