Picture Uploader Only Allow JPG, JPEG, and PNG

jordanryankennedy_as · 2020-12-30T00:46:32.555Z

I’m using a standard Picture Uploader element but it seems no matter how I test it, the Picture Uploader allows users to drop in whatever kind of file they want.

I need to only allow .jpg, .jpeg, or .png (upper or lowercase). I’ve tried a few things, but nothing is working. I’ve been trying for hours to find something that works. My latest effort is this:

Screen Shot 2020-12-29 at 6.41.16 PM760×698 59.4 KB

and then also

Screen Shot 2020-12-29 at 6.45.28 PM850×664 56.2 KB

For some reason it works only for lowercase .jpg instead of uppercase .JPG even though I have a lowercase filter.

I have also tried using the workflow “An input’s value has changed” and adding only when file name contains .jpg… etc.

tzuork · 2020-12-30T02:58:04.340Z

Why are you stipulating :lowercase? Just have “doesn’t contain .jpeg” for example, you don’t need to stipulate if it’s lowercase or uppercase, Bubble doesn’t check that when you do “doesn’t contain”.

“Main Photo Upload’s value is not empty and Main Photo Upload’s value file name doesn’t contain .jpg” will work for upper and lowercase.

tzuork · 2020-12-30T03:09:16.424Z

Ah I see what you mean, bare with me.

tzuork · 2020-12-30T03:18:01.208Z

Right I’ve done what you need to do. For this example I’ll assume you’re trying to allow a user to put a Profile Picture on.

Right click your Picture Uploader and start a workflow.
Put “Only when this Picture Uploader’s value’s file name doesn’t contain .jpg or this Picture Uploader’s value’s file name doesn’t contain .jpeg or this Picture Uploader’s value’s file name doesn’t contain .png”
Reset input
Show “Warning Text” (for a example a pop up that says “Your image needs to be .jpg, .jpg or .png. Please try again”

then

Copy the above workflow, and paste it so you have two. On the second do “Only when this Picture Uploader’s value’s file name does contain .jpg or this Picture Uploader’s value’s file name does contain .jpeg or this Picture Uploader’s value’s file name does contain .png”
Make a change to User (this may change depending on what you’re doing) then add field Profile Picture = this Picture Uploader’s input (this may also change)
Ensure that your Picture Uploader is set to dynamic and put This User’s Profile Picture. (this may change too depending on what you’re doing)

That’ll allow your user to ONLY upload a .jpg, .jpeg or .png image and if they try to upload something other than that will tell them to put the correct image file in and will keep the Picture Uploader empty.

Hope that helps!

Ash

jordanryankennedy_as · 2020-12-30T21:16:18.863Z

Unfortunately I couldn’t get that logic to work. I even tried in another Bubble app just to make sure. It fails no matter what kind of image I try.

Screen Shot 2020-12-30 at 3.15.26 PM806×846 55.4 KB

tzuork · 2020-12-31T03:00:08.739Z

The above does work for your use case so you’ll just need to keep triple checking each step until it works. If you’re on a paid plan feel free to go to settings, collaboration and add my email “mrashleyelderstone@gmail.com” and I’ll jump on it for 2-3 minutes and fix it for you.

It can be really stressful when something isn’t working but it’s often something overlooked and small that’s messing it up.

Failing that you can screenshot me every step I’ve explained above and I’ll check you’ve done it all correct.

~ Ash

system · 2021-03-10T00:46:33.410Z

This topic was automatically closed after 70 days. New replies are no longer allowed.