Services Plugins FAQs

AWS File Uploader - Detect when file has been selected?

Plugins
#1

Hi,

I give the user the possibility to upload a file in a project management.

I have the problem that it takes between 1 and 3 seconds for the upload process to start. In the meantime the user can already press the save button. As a result the file is not available in the entry.

To prevent this I use a progress bar. If this is visible the save button is deactivated. With the old elements the upload started immediately, with the new elements it takes 1-3 seconds, probably because of the new necessary action “When A File uploader Generation URL”.

In this loom you can see that it takes more than 3 seconds until the upload starts and the progress bar becomes visible. The Save button is also deactivated at this moment but not before.

Here is a second Loom. I select the images and press Save before the image upload has started. As a result the images are missing from the entry.

I have tried all states of the file uploader but cannot find a way to deactivate the button as soon as a file has been selected. This is because all states can only be used when the upload starts (I already use them to display the progress bar) or is already complete (because the file URL, file size, file name, etc. are only then available).

How can the problem be solved?

#2

Hi @ch-schroeder,

Thanks for reaching out! While the plugin doesn’t have the specific functionality for your use case, the great thing about Bubble is that you can build almost anything!

Here’s how I managed to achieve a similar use case by creating a custom state and adding a couple of actions and one workflow:

  1. Custom State: I created a new “yes/no” custom state, named “hide.” If the value of this state is set to “Yes,” I hid the button on my page (you can also make it non-clickable or apply any other formatting/constraints you prefer). Here is the constraint added to the Button element used for testing.
  2. Generation URL Workflow: In the “Generation URL” workflow, I added the “Set state” action as the first step. I selected the “hide” custom state and set its value to “Yes” (this hides the button as soon as the upload starts) - screenshot.
  3. Progress Check Workflow: I created a new “Only When” workflow that triggers whenever the condition “FileUploader’s Progress of Files Upload (%) is 100” is met. This ensures that the workflow runs once the upload reaches 100% progress - screenshot.
  4. Show Button: In this new workflow, I set up a “Set state” action to set the “hide” custom state to “No,” making the button visible again - screenshot.

You can add more constraints to the workflow or action to check if the URL is available or make other adjustments to integrate this solution into your setup. Even though a plugin may not have a certain feature, it’s often possible to find a workaround :hugs:

Let me know if you need further details or clarification!

Best regards :sunflower:

Browse all Zeroqode Plugins for Bubble
Banner_Last3

#3

Yes that’s clear so far. But what do you do if the user clicks on “Cancel Upload”? There is no event for this in the Workflow tab. In this case I can’t set the state back to “No”.

I would use the action “A File uploader Current file uploaded” for this, which is the same result, isn’t it?

#4

Hi @ch-schroeder,

You can remove the Cancel button by clearing the text in the “Cancel Button Caption” field. After the file is uploaded, the Remove button can still be available, allowing users to delete any file they don’t want.

Regarding the event, the one you mentioned will trigger after each file upload, which will make the button visible before all files are uploaded. Instead of the Only when workflow I mentioned, you can use the “All Files Uploaded” event, which will trigger when every file has been uploaded.

Let me know if you have more questions!

Best regards :hibiscus:

Browse all Zeroqode Plugins for Bubble
Banner_Last3

#5

i didnt see the “all files uploaded” event, thank you!

#6

Hi @ch-schroeder,

My pleasure :hugs: Please let me know if you have any other questions or concerns, as it would love to help you out!

If you’ve been enjoying our plugins, we’d love to hear your thoughts! Your feedback not only makes our day but also helps others in the Bubble community discover the best tools for their projects. Leaving a quick review takes just a minute and makes a world of difference. Simply head to the Plugins tab in the Bubble editor, search for the plugin, and rate it :star2:

Best regards :sunflower:

Browse all Zeroqode Plugins for Bubble
Banner_Last3