Problem/Motivation
In order to improve user experience with reduced action steps in Entity Browser, this ticket is created: #2822009: Improved MultiStep selection display. In that ticket adding/removing elements in multistep selection display is done over ajax requests, where overall user experience is way better.
We want to add support for usage of provided functionality of multistep selection display with upload widget. And one of upload widgets for entity browser is dropzonejs submodule -> dropzonejs_eb_widget.
Proposed resolution
Possible solution to trigger automatic selecting of entities with dropzonejs widget is to trigger submit process of widget and after it's successful to return list of added entities. That list can be used to trigger selection of entities in multistep selection display.
In this case process is a bit longer then in case of view widget, since files has to be uploaded and entities created, before we can trigger selection in multistep selection display.
These are steps:
- drop files in dropzone
- they are automatically uploaded and validated
- after validation and upload is finished, clear all rejected files, so that at end we have files that can be used to create entities
- over ajax request, automatically submit form and that will create entities and list of created entities will be returned
- returned list will be used in javascript to trigger selection in multistep display (and this part is similar to view selection widget)
Remaining tasks
- Same functionality should be provided for default upload widget
User interface changes
In user interface there is change that "Select entities" button is not displayed if widget is using "auto_select" functionality. Because that flag means that widget it self will handle selection and there is no need for default submit action to be trigger by user.
*Edit* Usability example (with keeping list of rejected files)

| Comment | File | Size | Author |
|---|---|---|---|
| #17 | interdiff_2823670_17_14.txt | 6.08 KB | mtodor |
| #17 | 2823670_17.patch | 10.67 KB | mtodor |
| #14 | improved_multistep-2823670-14.patch | 9.43 KB | chr.fritsch |
| #12 | auto-submit-dropzonejs-with-rejected-list.gif | 1.74 MB | mtodor |
| #12 | 2823670_12.patch | 10.75 KB | mtodor |
Comments
Comment #2
mtodor commentedComment #3
mtodor commentedHere is github pull request: https://github.com/drupal-media/dropzonejs/pull/34
Comment #4
slashrsm commentedComment #5
mtodor commentedApplied change related to enity_browser modifications in #2822009: Improved MultiStep selection display and also from comments on github.
Pushing patch here for checking of tests and easier usage in packaging tools.
Comment #6
mtodor commentedRe-based patch and adjusted schema to be compliant to changes in entity browser issue.
Comment #7
mtodor commentedComment #8
primsi commentedGreat work! A few questions/notes:
Comment #9
mtodor commented@primsi: Thank you!
Comment #10
primsi commented#9.1 Oh, my bad. Then it's probably not needed.
#9.2 The thing I noticed the other day in another issue (which was dealing with implementing maxFiles) is that if the upload fails because of the file is too big and if it then gets removed automatically, the user has no way to know what went wrong. So in the other issue we ended up reacting to maxfilesexceeded instead of queuecomplete. Not sure if this helps.
Comment #11
mtodor commentedRegarding point 2.: We had "short" discussion on IRC. Conclusion is that best option would be to auto-submit all valid files (and auto selected them) and that rejected files stay in dropzonjs list -> so that it's transparent for user what really happened and why files are rejected.
Comment #12
mtodor commentedHere is solution for functionality explained under #11. Gif with demonstration of functionality attached too.
Comment #13
mtodor commentedComment #14
chr.fritschI removed the changes which are made in #2827120: DropzneJS is cleared on every Ajax response from the patch.
Comment #15
mtodor commentedComment #16
chr.fritschBlocked by #2827120: DropzneJS is cleared on every Ajax response
Comment #17
mtodor commentedRebased patch and made adjustments related to committed changes done in #2822009: Improved MultiStep selection display.
Additionally - fix issue that validation wasn't triggered properly and error message in case validation has failed will be propagated properly to front-end in case of ajax request.
Comment #18
woprrr commentedWork well for me that ok :) Great job guys !!!!
Just one thing about tests, that would be great to add this validation to tests in other issue seen with @chr.fritsch #2824871: [meta] Extend DropzoneJs test coverage
Comment #20
chr.fritschThanks everyone for testing and mtodor for this amazing work.
Committed and pushed.
Well done