Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Dropzone.js v4+ - Display existing files on server with work limiting the number of files and other functions

How to add existing files on server to dropzone with right work all functions and right styling?

like image 484
mixalbl4 Avatar asked Dec 24 '22 16:12

mixalbl4


1 Answers

I wrote a function to add files: addCustomFile(file, thumbnail_url , responce)

Powered by Version: 4.0.1 stable

Correct working: maxFiles limit, event maxfilesexceeded, event success and others

$("#dropzone-images").dropzone({
    url: "...",
    paramName: 'image_temp',
    maxFiles: 1,
    init: function () {
        this.addCustomFile = function(file, thumbnail_url , responce){
            // Push file to collection
            this.files.push(file);
            // Emulate event to create interface
            this.emit("addedfile", file);
            // Add thumbnail url
            this.emit("thumbnail", file, thumbnail_url);
            // Add status processing to file
            this.emit("processing", file);
            // Add status success to file AND RUN EVENT success from responce
            this.emit("success", file, responce , false);
            // Add status complete to file
            this.emit("complete", file);
        }

        this.addCustomFile(
            // File options
            {
                // flag: processing is complete
                processing: true,
                // flag: file is accepted (for limiting maxFiles)
                accepted: true,
                // name of file on page
                name: "The name",
                // image size
                size: 12345,
                // image type
                type: 'image/jpeg',
                // flag: status upload
                status: Dropzone.SUCCESS
            },
            // Thumbnail url
            "http://.../img.jpg",
            // Custom responce for event success
            {
                status: "success"
            }
        );
    }
});
like image 82
mixalbl4 Avatar answered Dec 27 '22 05:12

mixalbl4