Image upload, remove and replace

Here’s what I would like to do:
[li]On click upload pic one of the three possible pics
[/li][li]Upload it to the first imagebox
[/li][li]Do the same for the other 2 remaining

So far so good. But then comes the tricky part:
I want all photos to move along with the one that is deleted using the trash icons (no succes till now)

and last but not least I would like to have the images switch position either by click or drag&drop

I would be most grateful if there’s anyone who could help me out here and take a look at my file

fileupload.rp (3.03 MB)

Cool file, actually deleting the photos shouldn’t be too difficult from what you already have. I just add a new concept from here, Function/Functions in Interactions (Triggering ‘Custom Events’ on Widgets, Trigger, Triggers, Actions Macro/Action Macros).

Use a Dynamic Panel OnMove to “move3to2” and a similar “move2to1”. This way when deleting 2 you just move “move3to2” by 0,0. When deleting 1 you first move “move2to1” then move “move3to2”. (Make sure to use two different Move Actions otherwise you might accidentally move 3 to 2 first and then move 2 to 1 which would mean 3 moved all the way to 1.)

RP File: FileUploadWithDelete.rp (3.03 MB)

*Note: I added some OnPageLoad Actions to show default photos to make this easier to test. You can easily take those out when you are done testing.

1 Like

Hi Ian,

So that does the trick :slight_smile:
Pretty neat! I gues a drag & drop simulation would also work using the same principal?

Thanks so much!

1 Like

This is great, thanks to both of you for sharing.