How can I allow the upload widget to upload multiple files on button click (reactive)
Application Type
Reactive

I have 3 tables. Datatable, FileTable, and join table DataFiletable which has Id, DataTableId and FileTableId.

From the datatable details screen, I want to allow users to fill the fields in datatable and attach multiple files before hitting submit.

When submitted, the datatable items should be saved to datatable, all the files saved to filetable and all the ID's of filetable saved in the datafiletable with the correct datatableid.

How can I do this without using a forge component? (I looked into the available forge component but was not able to use it for my case)

mvp_badge
MVP
Solution

Hi,

It's pretty straightforward. You have to download the component to your env, reference the reusable block from the component module, and configure it as required.

I would suggest you take a look at the Demo application. There is an option to download the demo application from the Forge component page.


  • For your use case, you will have to use this component reusable block to the screen.
  • An after selecting multiple files, the handler screen action mapped with the block (in the screen scope) will get the list of selected files from the block, which you can further use in the save button action flow by iterating the File List and saving each file to the respective entity against the newly created student Id.


If you get stuck with the implementation, share the .oml file (if possible), and we can help you with the implementation.


I hope this helps you!


Kind regards,

Benjith Sam

You can't. As far as I know the Upload widget only supports one file selection at the time. But if it's no problem that users need use the component multiple times to select all files you could create something that add the selected file to a list and then upload this list when submitting. 

I found that when you set attribute of "multiple=1" the upload widget allows selection of multiple files. But the question is how can we get all the files to upload on submit.

mvp_badge
MVP

Hi,

That's possible. We can allow the user to select multiple files using the default Upload widget by defining the "multiple=1" attribute in the extended property.

You can refer to the Forge component which I have created for this use case: ExtendedNativeFileUpload

Demo Screen: ExtendedNativeFileUploadDemo

I hope this helps you!


Kind regards,

Benjith Sam

Hi Sam wow that looks promising for me! I am pretty new at this. How can I use it on my form. I have a form which creates let's say students info. I want to use your multiple files upload widget on my form so when I am adding Student information, I can browse the related files and when I hit Save, it should add the STudent info and add multiple entries to my file table with the newly created studentid, filename, filecontent. How would I do that? 

mvp_badge
MVP
Solution

Hi,

It's pretty straightforward. You have to download the component to your env, reference the reusable block from the component module, and configure it as required.

I would suggest you take a look at the Demo application. There is an option to download the demo application from the Forge component page.


  • For your use case, you will have to use this component reusable block to the screen.
  • An after selecting multiple files, the handler screen action mapped with the block (in the screen scope) will get the list of selected files from the block, which you can further use in the save button action flow by iterating the File List and saving each file to the respective entity against the newly created student Id.


If you get stuck with the implementation, share the .oml file (if possible), and we can help you with the implementation.


I hope this helps you!


Kind regards,

Benjith Sam

Hi Sam I was able to figure it out. This is super awesome. Thank you so much!!

mvp_badge
MVP

You're welcome, Glad to help you :)


Kind regards,

Benjith Sam

Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.