How to get a URL from server and convert it into a valid Dropzone.js file object? Code Answer

Hello Developer, Hope you guys are doing great. Today at Tutorial Guruji Official website, we are sharing the answer of How to get a URL from server and convert it into a valid Dropzone.js file object? without wasting too much if your time.

The question is published on by Tutorial Guruji team.

I’ve just been trying to figure out how to get a file URL from the server and display it as an image in dropzone. The problem I have is I have no idea how to convert that URL into a dropzone file object. I’ve checked out this, and I get the idea, but the explanation isn’t that clear.

Here is my code:

$('.c-section').on('click', '.s-body-row', async function () {  
  // AJAX stuff
  let file = res.data.file
  // File syntax is { name: smthng, url: smthng }
  upDropzone.emit("addedfile", { name: file.name }) // error is here
  upDropzone.emit("thumbnail", { name: file.name }, file.url) // This does not run (obviously)
})

Any help is greatly appreciated!

Thanks in advance!

Answer

try the following :

var mockFile = { 
                name: 'name.jpg', 
                size: 12345, 
                type: 'image/jpeg', 
                status: Dropzone.ADDED, 
                url: 'url.com',
                accepted: true
            };

            // Call the default addedfile event handler
            myDropzone.emit('addedfile', mockFile);
            //show the thumbnail of the file:
            myDropzone.emit('thumbnail', mockFile, 'url.com');
            myDropzone.emit('complete', mockFile);
            myDropzone.files.push(mockFile);
We are here to answer your question about How to get a URL from server and convert it into a valid Dropzone.js file object? - If you find the proper solution, please don't forgot to share this with your team members.

Related Posts

Tutorial Guruji