Drag and drop — order issue

[mai]

Hi everyone,

I’m attempting to create a repeating group with drag-and-drop entries. I followed the instructions here as closely as possible: Drag - Drop Reorder Your Repeating Group

Unfortunately, something’s not quite right. When the elements are dragged around, their “order” empties and becomes null. This is the second time I’ve followed these instructions — what am I missing here?

Here’s what I’m working with: https://bubble.io/page?type=page&name=builder&id=projecti-public

Thanks!!

[fayewatson]

Hey @mai In your first action of the workflow - you’re setting a custom state on the “Drop Area Animal”, instead of the repeating group:

Then, when the action in step 3 sets the order field to repeating group’s order, that value was never set in the workflow (I think why it’s coming up null):

I just switched the first action to set the “old-order” state on the repeating group element:

Also the second action in your workflow was setting the order field of the Dropzone Animal’s field to:

And this should be:

It looks like the refresh action isn’t needed anymore so I removed that as well. Also, some of the Animals in the database didn’t have a number in their Order (the field was empty). I entered a number for each Animal manually, but you’ll want to make sure that when new animals are created, they are assigned a value for the Order field that isn’t the same as the others to ensure everything can be dragged and dropped correctly.

And that should do it! Feel free to let me know if you have any questions.

[mai]

Thank you SO MUCH for taking time out of your day to help, Faye! This is admittedly my first time using custom states and drag-and-drop elements, but I’ve just learned a ton from your fix!!

I’ll now add a formula to create unique numbers (order:max+1) so that things run smoothly

[fayewatson]

My pleasure, @mai! So glad it was helpful! And that sounds like a great plan for the order field as well!