Dropzone: handle multiple files

[jmsche]

It would be nice if Dropzone could handle multiple files.

I was expecting it would as its parent type is the FileType, that allows setting multiple option to true.

[tgalopin]

Yep, that's a good idea! I'm not sure how to handle it properly yet but that's a good idea :)

[AxelBriche]

Probably like https://www.dropzonejs.com, with multiple query in ajax for upload each image and return a valid or error response.

[Lenawel]

is Multiple Files allowed or not yet ?

[connorhu]

I plan to make multiple and chunked file uploads in one of my pilot project. At this moment I don't find any "official" direction about templating of UX modules (small prototypes). This is problem at my symfony collection type ux module too.

[yassinehamouten]

Hello, I am having the same issue. I did a few things to make it work. I will try to make it available to everyone as a package

[expace-dev]

Hello,

someone have the solution to do multiple upload?

[yassinehamouten]

Hello,

You can see how I make it work there https://github.com/yassinehamouten/ux-dropzone-multiple/tree/main/Resources. I tried to do it as a package, but stimulus does not call my controller. If someone has an idea...

I changed:

• in the form template I added "multiple" in the file input https://github.com/yassinehamouten/ux-dropzone-multiple/blob/3d282f520811ae720b0b194b7d28363eba6a1502/Resources/views/form_theme.html.twig#L6
• and in the controller.js https://github.com/yassinehamouten/ux-dropzone-multiple/blob/main/Resources/assets/src/controller.js

You can change the symfony ux-dropzone package and build your js. It will work on production

[yassinehamouten]

It's look like this if you take the css too

[JML75]

thank fou for your work, does it work if you use the DropzoneType:: class in your formType ?

[tgalopin]

@yassinehamouten this is interesting, I wasn't sure we could do it with the multiple attribute, good news! That would be a great PR if you wish :) !

[daFish]

@yassinehamouten Would it be ok for you when I create a PR with your changes?

[JML75]

hello

not sure what your are talking about.

best

JML

Le 24 oct. 2022 à 11:13, Marcus Stöhr @.***> a écrit :

@yassinehamouten https://github.com/yassinehamouten Would it be ok for you when I create a PR with your changes?

— Reply to this email directly, view it on GitHub https://github.com/symfony/ux/issues/7#issuecomment-1288703844, or unsubscribe https://github.com/notifications/unsubscribe-auth/AUX2AHWA2VLRZLX3XYAC6IDWEZHLPANCNFSM4UNKKZQA. You are receiving this because you commented.

[CodingBDX]

i'm interesting, i try it but solution not work... what's the package to install dropzone-multiple? or just replace dropzone ux??

[weaverryan]

I think @yassinehamouten basically forked symfony/ux-dropzone and made some tweaks to make it work with multiple - https://github.com/symfony/ux/issues/7#issuecomment-968084788 - if it's that simple, it would be great if someone made a PR here to add that support :)

[CodingBDX]

i try to use, this https://github.com/daFish/ux/tree/feat/dropzone-support-multiple-files/src/Dropzone/Resources

but it's not work at all...same result, just one picture @yassinehamouten i try it but it's old code for old version...

[daFish]

@CodingBDX I have not yet finished the port in the linked PR. But I just rebased my branch and it is now up-to-date.

[nzurita]

@CodingBDX I have not yet finished the port in the linked PR. But I just rebased my branch and it is now up-to-date.

Does this mean multiple file upload will be available soon?

[daFish]

@CodingBDX I have not yet finished the port in the linked PR. But I just rebased my branch and it is now up-to-date.

Does this mean multiple file upload will be available soon?

I could certainly need some help with finishing it.

[igi-1w3r53n]

Is there an update on this topic? It seems not to work out of the box with the current version (2.7.1).

[kristjan-kure]

Hi! We need multiple file upload. Who can help with this? I understand daFish has been developing it, but we need it live? Who on the Symfony development team can help us to work with this?

[janklan]

Hi! We need multiple file upload. Who can help with this? I understand daFish has been developing it, but we need it live? Who on the Symfony development team can help us to work with this?

Welcome to open source. What's your budget to speed things up? I'm sure @daFish and others would find time to work on work-related things more readily than passion hobbies :-)

[igi-1w3r53n]

I had a lot of trouble with this solution. I switched to uppy (https://uppy.io/) and it works good with symfony.

[daFish]

@janklan After some thoughts I'm not going to finish this. It is based upon the work of @yassinehamouten and I'd rather propose to go with uppy.io - which is already mentioned by @igi-1w3r53n.

[janklan]

@janklan After some thoughts I'm not going to finish this.

Fair enough mate, I've been using Dropzone.js directly myself ever since I found this limitation - pretty much the same day I found this component.

For everyone else: all you need to receive multiple files is making sure your JS dropzone component (whichever it is) uploads files individually behind the scene, and then something along this trivial piece:

if (0 === $request->files->count()) {
    throw new BadRequestException('At least one file is required.');
}

if ($request->files->count() > 1) {
    throw new BadRequestException('Uploading multiple files at once is not supported.');
}

$uploadedFile = $request->files->get('file');

I'm honestly not convinced there is a need for an UX component and a dedicated form field for this. What does it actually simplify?

[cmartin6]

Is there an update on this topic? I need an option to allow multiple file-uploads using this dropzone-component...

[kristjan-kure]

I don't understand the priorities. They should be:

• Common UI components - the essence of multiple image upload is to save data. This should have been built once Symfony UX was developed.
• Multiple select - we had to use https://tom-select.js.org/
• Modal - I don't see it on https://ux.symfony.com/.
• WYSIWYG editor - I don't see it on https://ux.symfony.com/.
• Gallery
• Date picker - I don't see it on https://ux.symfony.com/.

etc.

[janklan]

I don't understand the priorities. They should be:

I find myself saying this more often than I like: welcome to open source. Feel free to contribute a solution to a real-world problem you're experiencing.

It's not easy, which is the reason why there are more takers than givers. If it helps you do your job and make a living, don't give advice how things should be, and give your time and skills instead :)

[kristjan-kure]

I don't understand the priorities. They should be:

I find myself saying this more often than I like: welcome to open source. Feel free to contribute a solution to a real-world problem you're experiencing.

It's not easy, which is the reason why there are more takers than givers. If it helps you do your job and make a living, don't give advice how things should be, and give your time and skills instead :)

Sorry, I am not a back-end developer, so I can't help build it, and I am not here to criticize. However, I can suggest a direction and discuss the need from my personal perspective.

With my experience of 20 years in web development, I believe the UX project requires a significant change in direction. One possible approach is to engage the community by allowing them to vote for UI elements. Those who have the time and expertise can contribute to building it. Votes will define the priorities. I do understand that you will need to figure out the message to send and motivate voters.

Here's an example: https://community.talk.hyvor.com/. This platform utilizes https://www.featurebase.app/ for feature voting.

[kristjan-kure]

The end goal here is to establish Symfony as a prominent PHP web application framework in the market?

[ytilotti]

@daFish had done most of the work. The problem is only on the preview because ux-dropzone manage already multiple files