CODEWITHSUNDEEP
phpdropzone.js
Chazy Chaz
Chazy Chaz

Reputation: 1851

can't upload multiple files with dropzone

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.

Upvotes: 4

Views: 3741

Answers (1)

Chazy Chaz
Chazy Chaz

Reputation: 1851

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
}

Upvotes: 1

Related Questions