Forum Academy Marketplace Showcase Pricing Features

Drag - Drop Reorder Your Repeating Group

Welcome @JohnMark !
Mostly learnt from the community, hope it is useful for you!

2 Likes

This is a perfect solution @soh.ju.hu!! Thanks :slight_smile:

Do you think there is a way to do this with multiple lists and move items between them? So how would you handle the list-order with 2 repeating groups so move a list item from one to the other?

2 Likes

Hey @eddy ,

Try this! (that’s what I love and hate about Bubble, too many ways to do things…)

Careful, I am lazy to create Category - Tasks relation in data model, so can’t do “Category’s Tasks”

Cheers
Ju Hu

8 Likes

:clap::clap::clap::clap::clap: bravo @soh.ju.hu

1 Like

That’s right there are a lot of ways! Thanks a lot for taking the time :slight_smile: This is exactly what I needed!! :smiley:

THANKS!

1 Like

Best solution so far. Thanks

1 Like

This is amazing. I’m glad I finally found this post. Thank you!!!

1 Like

This is hands down the best solution for reordering lists with Drag & Drop !

Thanks a lot @soh.ju.hu !

1 Like

I am new to Bubble. I am learning about custom states still. I like and implemented your drag - drop reorder your repeating group solution. Thank you for posting it! Now I’m trying to refactor it to tie it to a specific user–so that the user who is logged in only sees his/her list of things and can only reorder a list associated with that user. I haven’t succeeded so far–really not great at custom states yet! Do you have any hints on how to refactor your solution so that the repeating group isn’t tied to all users of the application but only one specific user’s list of tasks?

2 Likes

Hey @tom10, trying to understand your challenge.
Do you mean you would like the repeating group to only show a list of items that belongs only the user? Isn’t that just setting the Datasource of the repeating group to filter out only items belongs to user? Why do you need custom states?

1 Like

Hey @soh.ju.hu, I think you are correct. I’m a newbie :see_no_evil:; sorry if I was not clear (and went off on a custom states wild goose chase). I will try to figure out how to change the data source of the repeating group to filter out items only belonging to the user. If I can’t get there, I will circle back. Thanks for the hint. I really appreciate it.

1 Like

@soh.ju.hu, your response yesterday was enough to get me back on track, and I implemented the solution you suggested in about 10 minutes of tinkering. Thanks again.
Onward!

1 Like

@tom10 most welcome! all the best!

1 Like

:clap::clap::clap::clap::clap::clap:

Thanks for a great solution! Here’s a little UX tweak for other folks who find this thread…
As written, this setup doesn’t allow for an item to be dragged one slot down - it will remain where it was (e.g.: I can’t swap the first two items in a list by dragging “1” onto “2”).

I added one more workflow step along with conditionals that cleans this up and makes it work more intuitively. (Check if destination is +1 from origin and respond accordingly).

In step 2:
image

New step 3:
image

Thanks!

2 Likes

is there a way to enable “long press to drag” for Draggable Elements plugin?

Very nice :grin::v:t2::v:t2:

Thanks a lot for this! Really simple and effective!

I assume there is no way of doing this without touching database, using Indexes instead of ListOrder otherwise you would do that? :slight_smile:

Wow. Glad to see that there have been many improvements on the topic since I first posted that.

@soh.ju.hu and others. I implemented your solution to the drag and drop list, and it has been working great for me on my app. But for some reason (maybe a bubble software update) it no longer will display my repeating lists at all (let alone allow me to reorder the items by click and drag). I can still see the items in the database, but they aren’t displaying. I cloned the app for this discussion and created a debugging user and password of [email protected] and password 88888888Pw.

For example, if you go to the app and then navigate (using menu in upper right to the page called Mood) you will see this Mood page has items that show up in the development version database but don’t display on the mood page:

Do you have any ideas what might be tripping this up?