Jmix 2.1 Multiple File Upload

Support
#1

Hi everyone,
There is a way on Jmix 2 to have a fileMultiUpload component?
In https://docs.jmix.io/jmix/files/uploading-files.html
I see that the components allow only one file, is there a way to select multiple files?
Thanks

#2

It seems that in Jmix2.1, there is still no component, but Vaadin has one. I’ve connected it programmatically. In my-view.xml, I added

<div id="uploadDiv"/>

Then, I injected it into the controller MyView.class with:

@ViewComponent
private Div uploadDiv;

@Subscribe
public void onInit(final InitEvent event) {
   MultiFileMemoryBuffer buffer = new MultiFileMemoryBuffer();
   Upload upload = new Upload(buffer);   
   upload.setAutoUpload(true);
   upload.setDropAllowed(true);
   ...
   upload.addSucceededListener(e -> {
         content = buffer.getInputStream(e.getFileName()).readAllBytes();
         // proccess file
   });
    
   this.uploadDiv.add(upload); // insert component to div
}
2 Likes
#4

Hi,

Currently, there is no MultiFileUpload component in Jmix 2.x. As suggested above, Vaadin Upload with MultiFileMemoryBuffer of MultiFileTemporaryStorageBuffer can be used for that purpose.

<upload id="upload1" receiverType="MULTI_FILE_MEMORY_BUFFER"/>
<upload id="upload2" receiverType="MULTI_FILE_TEMPORARY_STORAGE_BUFFER"/>

@Subscribe("upload2")
public void onUpload2AllFinished(final AllFinishedEvent event) {
    MultiFileTemporaryStorageBuffer receiver = (MultiFileTemporaryStorageBuffer) event.getSource().getReceiver();
    Map<UUID, TemporaryStorageFileData> files = receiver.getFiles();
}

Regards,
Gleb

2 Likes
#6

Thanks to @seit.art.develop and @gorelov ,
this is my implementation in the context of GruppoFoto (edited entity) has many Foto

@Subscribe
    public void onInit(final InitEvent event) {
        MultiFileMemoryBuffer buffer = new MultiFileMemoryBuffer();
        Upload upload = new Upload(buffer);
        upload.setAutoUpload(true);
        upload.setDropAllowed(true);

        upload.addSucceededListener(e -> {
            try {
                byte[] content = buffer.getInputStream(e.getFileName()).readAllBytes();
                
                InputStream fileStream = buffer.getInputStream(e.getFileName());
                FileStorage fileStorage = fileStorageLocator.getDefault();
                FileRef fileRef = fileStorage.saveStream(e.getFileName(),fileStream);
                Foto foto = dataManager.create(Foto.class);
                foto.setFile(fileRef);
                foto.setGruppoFoto(getEditedEntity());
                dataManager.save(foto);
            } catch (IOException ex) {
                throw new RuntimeException(ex);
            }
        });

        this.uploadDiv.add(upload); // insert component to div
    }