can't upload multiple files with dropzone

Question

I'm using the dropzone.js library but it's not working.

In the upload script I count the files to see if it works:

$file_count = count($_FILES['file']['name']);
echo $file_count;

But it only prints 1 all the time (I tried uploading 2+).

HTML:

<form id="propForm" class="" name="" action="upload.php" method="POST" enctype="multipart/form-data">
    <div class="option img">
        <h4>Imagenes (m&#225;ximo 6):</h4>
        <div id="dropzone" class="dropzone">
        // hidden input is appended here
        </div>
    </div>
    // more inputs
    <input value="Subir" type="submit" name="submitIT">
</form>

Dropzone options:

$('div#dropzone').dropzone({
    url: 'upload.php',
    paramName: "file[]", // The array is initialized here but it's not working
    acceptedFiles: 'image/*',
    addRemoveLinks: true,
    parallelUploads: 6,
    maxFilesize: 6,
    maxFiles: 6,
    autoDiscover: false,
    autoProcessQueue: false,
    uploadMultiple: true,
    hiddenInputContainer: '#dropzone',

    init: function () {
        thisDropzone = this;
        thisDropzone.on("maxfilesexceeded", function(file) { thisDropzone.removeFile(file); });
        $("input[type=submit]").click(function(e){ 
            e.preventDefault();
            thisDropzone.processQueue();
        });
        this.on("successmultiple", function(files, response) {
            alert('works');
            $("form#propForm").submit();
        });
    }
});

Upload.php output:

1  // output for echo $file_count;
Notice: Uninitialized string offset: 0 // $filen = $_FILES['file']['name'][$i]; (inside a for)

EDIT: It was working, just that the files are uploaded first than the form, so I was getting 1 and the notice.

Same problem was with me too. Till date i didn't got any answer. I will wait here for the answer. — Nana Partykar
Notice: Undefined index: name in /home/aet/web/upload.php on line 3 and 0 — Chazy Chaz
@NanaPartykar Hope you can make it work now, I found the problem and a solution. — Chazy Chaz

Chazy Chaz Chazy Chaz · Accepted Answer · 2015-11-15T04:35:48

My problem is that I need to create a custom folder for the images (based on the data of the form) so it won't work because it first upload the files and then the form. If someone needs this too, I found this jquery plugin: it's more basic, it just converts an input type file in a preview area (you'll have to create or show one for each file but you can do this easily with jquery) but at least it works.

The above code will just work to first upload the files in the queue and then submit the form data so just make sure the upload script will handle both separately:

if ($_FILES['file']['error'] == 0) {
// move_uploaded_file (single file)
// or a for($i=0; $i < $file_count; $i++) (multiple files)
}

if ( $_SERVER['REQUEST_METHOD'] == 'POST' ) {
//filter the data and store it in db
}

can't upload multiple files with dropzone

1 Answers