Question to Drag and Drop Component

Hi
I want to see the files that I have selected possible delete one of the files instead of all files.

I'm using Drag and Drop
image

If I Select 5 files it looks like this:
image

Is this possible:
1.
1A. To have drag and drop zone show the file information, e.g?
image
1B.Alternative a script that list file data in a seperat table and if possible remove files. e.g:

  1. Prevent users to upload files that is blank (0kb) or do i need to use rules
    image

Hi @Thore

fileDropzone component has name, base64Data, type and sizeBytes values, and if you inspect the state you can check that out when you drag the file into the component.

You can set the max size in the validation rules to limit the number of bytes combined files can have.

As for the previewing the data, you can set a list view or a table and use fileDropzone as a data source. Alternatively you can use a variable and set the fileDropzone value to it. Then you can use the variable as a data source, and filter out the results using the table action.



Hope this helps! :sunny:

Hi @Milan_Kalem

I see you have the Trash bin in the textarea. Is it posible to add this to the table also?

In advance thank you for your help.

Yes, you can add that as a table row action and filter out the current row

Hi @Milan_Kalem

Issues with removing files from the fileDropzone

I now have the delete trash on the table rows and it deletes the rows in the table :slight_smile:

If i delete 2 rows from the table the drag and dropzone still have 5 files in the fileDropzone.

Is it possible do remove the files from the fileDropzone when deleteing the row in the table?

-Thore

That is because the table is referencing the variable as a data source. Seems like you cant setValue to dropzone component, but you can still use the variable value for any kind of manipulation/upload etc.

Hi @Milan_Kalem

As I understand you.

There are no way to removed one of X files from the Drag and Drop zone?

-Thore

To my understanding, you can not pick to remove specific file from drag and drop zone natively, and the process above is passing the values from dropzone to a variable so you can manipulate it further.

1 Like

Hi @Milan_Kalem

For now i only whant user to upload PDF files.

One idee is to only store the base64 to my DB with filename from the table and not save the uploadfile from fileDropzone.

Question, Can I use retool to allow user to see the file based on Base6?
Or do I need a separate tool to convert Base64 back to PDF.

-Thore

There is a PDF component that allows you to preview the file before making a decision to upload the file

1 Like

3 posts were split to a new topic: Retool as Request Tool