[New Feature] Draggable/droppable elements

Hey Laurence,

I disagree my good friend. Emmanuel’s built a solid platform.

A drag n drop experience is simply a collection of concepts for us to klack together.

I suggest we not blame Bubble. They are working their butt off to improve this platform with their small team. Drag n drop is a great exercise for us to chew through to sharpen our logical and algorithmic ponderin swaggah.

I frankly feel that the Drag/Drop function is an excellent tool.

I know you’re working on things (as we all are!) Let me know if you’re stuck with any specific thing.

Much Peace

Ashley

ps. May I ask what it is about Drag/Drop that you find unsatisfying?/what is your use case scenario for which it falls short?

2 Likes

I have not attempted to implement drag-drop for nearly nine months. This week I’ll have a go at it again.

Sounds great Laurence!

let me know how it goes!

Ashley,

I’ve resurrected a pretty basic example of drag-drop reordering in a repeating group.

Details are in the longer thread focused on reordering a repeating group:

1 Like

Howdy Laurence,

Yes, I saw that post. There are lots of details, but not enough to accurately determine the cause of your user experience woes. I like your arrow-to-the-top/bottom. I created layered zones at the top and bottom of my list to detect pulling way up or down. With a timer attached, the scrolling accelerates exponentially so reaching the top is quite easy. (it’s kinda like that old excel view scrubber thingy)

Have a great week.

Ashley

If anyone looking for drag drop reordering list, like to share what I have done so far. hope less people need to rethink about this from scratch.

1 Like

I tried moving this with a Floating Group and after it moved, it lost its ability to float.

Seems this has stopped working as of yesterday.
Really weird behavior when dragging (the group disappears, but is ‘somewhere’ as can be seen by the scrollbars) and then just pops back to original location when dragging is done.

Anyone got some intel on this?

Tried it this morning and after a reload everything seems to be in working order again.

Is there any method to let an user add a draggable group?

I hope my users to add draggable groups in the drop area as many as they want.

like if they click a button, then a draggable group is added in the drop area.

Is this possible??

1 Like

What’s the point of using the drag and drop if the item I’m dragging disappears post-drop?

How can you get around this?

I have not used the function yet but in looking earlier there is an option to move back instead of hide group. Not sure if this helps…

It’s weird, but to obtain the behavior you are looking for (drag, drop and stay), you will hide the dragged element when dropped while showing a new element in the new position.

Ie. if you drag between two repeating groups, when you drop you should add the dropped element to the new repeating, therefore making it appear as dropped in the new list.

1 Like

Hey, has anyone figured out how to save the exact location of a dropped element when the page is refreshed?

Hi, I am trying to get the coordinates X, Y of the draggable group, but it is not available any longer. Is there a parameter that needs to be set to make it accessible?

Thanks

This doesn’t work for me, not sure why.

Does anyone know of a way to get a droppable area to not be fixed width? It’s throwing off my responsive design.

1 Like

Hi! Great feature! Is there a way that I can drag the group using an icon rather than clicking anywhere on the group? I dont want users to be able to drag from every part of the group shown below. The drag should only work if I click on the 3 bars on the right.

Hey Skinnydow!

I was wondering if you had found a solution for this? I’m also running into the same issue with it not looking as “pretty” as I’d like.

Hey draked123,
Unfortunately droppable areas are always fixed with. I just ended up having to create a design where the droppable area could stay fixed with and everything else around it resizes.