Forum Academy Marketplace Showcase Pricing Features

How are ranking readjusted in DB when items are re-arranged via Drag and Drop

I have a list of things with their ranking, and a page where a user can re-arrange the ranking of items in the list, how can i adjust the DB accordingly?

Example the user drags item 15 to row 4?

I can tell the database to change item 15’s ranking to 4, and items 4’s ranking to 5, but now i will have 2 items that have 5 as their ranking

1 Like

Create a workflow, possibly backend, to run on a list. Every time an item is dropped, run the workflow on the list and make the rank of each item it’s current cell’s index.

Have u ever tried it? is this stable? can buble handle this well?

Yes the backend workflows work great. I have run a workflow on a list but not with this exact example.

are those list-workflows limited to a max # of items?

I can’t find the source for what I read the other day but I believe the backend workflows are designed to be able to do hours worth of work without interfering with the performance of your app. The front end workflows are designed for making small data changes when it will benefit visual data being displayed to the user. But front end can handle up to 100 items or more if it to display a list of items or users sorted by rank.

1 Like

I did this with states.

Here is an example:
List has 20 items

You drag item 15 to the 4th position.

Use states to create two lists, one below and including the moved item and one above minus the moved item:
Below list: Items 1-3 plus item 15
Above list: items 4-20 minus item 15
Set old list in DB to: “Below list” “merged with” “Above list”

You can create a second workflow if you’re moving an item “below” another item rather than “above” another item.

1 Like

I tried to figure this out for like two hours yesterday and even built a plugin to reorder the items and give them back to bubble but the problem is still that you can’t seem to make changes to a list and the access each items’ index within the list so I would say with bubbles current constraints this cannot be done. The issue is it is trying to make a change to multiple items, editing its rank to equal its new index in the list, not just one list of items.

1 Like

But isn’t this a common feature needed for any app? i dont see any app that uses lists that wouldn’t need this.

There should be a way its done

I am not using the plan that gives me access to the backend workflows so I can’t test that right now. But I think it is odd that you can’t say ‘for each’ item in the list, make changes to its ‘rank’ field and make that change a dynamic value. Maybe this could be brought up to bubble support as I agree it should be possible. Really they just need to update the make changes to a list to include indexOf or make current iteration within the list an available value to access.

1 Like

I accomplished this with states. It’s possible

1 Like

Will check it out soon, thanks

1 Like

You’re very welcome. When I get back to my computer I can try and set up a test app to demonstrate the workflows.

1 Like

Thanks, Please do

I see @gbenchanoch has a possible solution which I will enjoy viewing. I finished a plugin that will accomplish what you are trying to do. It has to be approved by bubble which may take up to 72 hours.
Here is the example:

Here is the editor:

1 Like

Nice, keep me posted

It keeps giving me the “We just updated this page…” meassage, i cant test

Ok that’s because I was working. I’ll stop now for the day. Go ahead.

ok does it work stable for bigger lists, like 30 items?

Here is a simple example of how to resort repeating groups and save them in the database utilizing the native drag and drop.

Dragdropsort | Bubble Editor

Dragdropsort | Demo App

I added some comments on the workflows. Let me know if you have any questions. I hope this helps.