Change order number of a list of things

mraine8 · 2024-07-22T00:15:43.346Z

Hi all,
I am using a drag and drop plugin so users can reorder a repeating group by dragging a cell in between two other cells, the data type ‘order_number’ then changes on the group dragged to make it in between the order number of the cell above and cell below. So if I drag a cell in between 4 and 5, it will make the order number 4.5.

Thats working great however for reasons irrelevant to his explanation, I need a way to then take a list of the cut up numbers and revert them to whole numbers. As per the picture below the order numbers could be 1, 1.8, 2.2, 4.3, 5… etc. I need to keep that order but change the order numbers to 1,2,3,4,5. So i need to keep the order but change the order_numebrs back to whole numbers in the same order.

As per the picture below, theres the order numbers (in the input boxes) which have been cut up as they get dragged and dropped sometimes multiple times, that order needs to be kept but I need the numbers to be whole, starting at 1.
There are 6 numbers in order in the photo below and I need the order to stay but the order numbers to be 1-6.
Thanks in advance,

Screenshot 2024-07-22 at 10.14.42 am

mraine8 · 2024-07-22T00:47:17.153Z

Update: the problem Im running into is that I need to revert the numbers back to the cells index. Thats working fine if I put a button on each cell and click individually. Then i can just use a workflow to say change current cells order number to current cells index. However I need to use an API workflow to run that command on a whole list. How do I send the current cells index number to a backend workflow?

boston85719 · 2024-07-22T06:03:45.522Z

mraine8:

use an API workflow to run that command on a whole list.

You probably don’t need to do that. Look into the free plugin called ‘orchestra’ it will allow you to run an action in every cell of the rg, which can be to set the value to the cell index.

adamhholmes · 2024-07-22T08:33:05.865Z

mraine8:

I need to keep that order but change the order numbers to 1,2,3,4,5.

It’s not too difficult…

First you need to establish whether or not the item is being moved Up or Down in the list.

If it’s being moved Up (i.e. to a ‘larger’ position number), then the first thing you need to do is reduce, by 1, all items with Order numbers higher than the moved item’s original order number, up to and including the item at the New position of the moved item.

So, for example, if you’re moving Item 3 to position 9 (in a list of 12), reduce by 1 items 4 through till 9.

Then just set the moved item’s ‘Order’ number to that of the Item it’s replacing (i.e. 9).

If you’re moving the Item Down (i.e. to a smaller ‘Order’ number), then first increase by 1 all items starting with, and including, the new position, up to, but not including, the original position of the moved item. Then change the Order number of the moved item.

e.g. If you’re moving the item at Position 9 to Position 3, first increase by 1 all items currently at positions 3 through to 8, then change the Order number of the moved Item to 3.

And don’t use an API workflow for this - it will result in a terrible UX - use a regular ‘on page’ workflow so that Bubble makes the changes to the client-side representations of the database objects as well as updating the database itself, for a much faster UX.

mraine8 · 2024-07-22T08:44:58.150Z

Hey mate thanks for your response but thats not my question. I have the reordering all sorted and working well with the drag and drop. The issue is that I need to keep that order but change the non-whole numbers to their index while not changing the order.

adamhholmes · 2024-07-22T08:56:58.578Z

mraine8:

The issue is that I need to keep that order but change the non-whole numbers to their index while not changing the order.

That’s exactly what I just explained how to do (i.e. do NOT use decimals here… just use integers, so that they always refer to the actual index in the list).

Alternatively, you could use a recursive backend workflow to adjust the order numbers after you’re rearranged them (if you insist on using decimals)… but not only will that be much slower, but also a lot more costly in WU (as you’d be doing everything twice, AND recursive workflows are the most WU costly way of doing Bulk data manipulations in Bubble anyway).

It’s much more efficient (in terms of performance AND WU cost) to set the correct order numbers in the first place, as outlined in my previous response.

mraine8 · 2024-07-22T23:51:23.630Z

adamhholmes:

If it’s being moved Up (i.e. to a ‘larger’ position number), then the first thing you need to do is reduce, by 1, all items with Order numbers higher than the moved item’s original order number, up to and including the item at the New position of the moved item.

I have played around with this method before but its very messy and by the way you described it would have problems. If i had a list of 5 things, and I moved the #2 in between #4 and #5. Then subtracted the ones below by 1 then 4 would be #3, 3 would be #2 and 1 would be -1. Theres usually issues like that making it quite complicated, the decimals seem to work better considering there will be lots of exceptions to your rule.

ihsanzainal84 · 2024-07-23T00:33:43.996Z

What drag and drop plugin are you using?

adamhholmes · 2024-07-23T08:43:25.631Z

mraine8:

I have played around with this method before but its very messy

It’s a lot less ‘messy’ than using decimals (which I thought was the thing you’re trying to avoid anyway - otherwise, what’s the issue?).

the way you described it would have problems. If i had a list of 5 things, and I moved the #2 in between #4 and #5. Then subtracted the ones below by 1 then 4 would be #3, 3 would be #2 and 1 would be -1.

What? That’s not what I said at all - you’ve misunderstood - I never said anything about subtracting the ones below it, it’s the opposite (you subtract from the ones above it, not below it, as you’re removing that item from its original position) - read it again.

The logic is simple:

1 stays as 1
2 becomes 4
3 becomes 2
4 becomes 3
5 stays as 5

Theres usually issues like that making it quite complicated, the decimals seem to work better considering there will be lots of exceptions to your rule.

Not at all… this can all be done with 2 very simple workflows (1 to adjust the order when moving to a higher position, and one to adjust the order when moving to a lower position).

And there is never an exception to the rule - either you’re moving an item higher, or you’re moving it lower. The logic always remains the same.

FWIW over the past year I’ve built some very complex drag and drop functionality in a number of Bubble apps, far more complex than simply re-ordering a RG (involving multiple different datatypes, multiple lists, sub-lists, nested RGs, and more), and it can get fairly complicated and require some custom code for it to work.

But for simply reordering a list in a RG, it’s simple to do in vanilla Bubble, as I’ve described above.

mraine8 · 2024-07-24T00:59:48.541Z

boston85719:

orchestra

Ok sounds like your correct, I’ll give this a crack and let you know. Thanks for following up mate

mraine8 · 2024-08-01T00:13:41.739Z

Hey mate looks like your spot on I’m just having trouble implementing this, any chance you could help me out? Would love to get this fixed been working on it for ages. Thanks

mraine8 · 2024-08-05T02:51:40.937Z

hey mate,
Ive been trying unsuccessfully to implement this solution, any chance you can spot where Ive gone wrong with the screenshots?
Thanks very much in advance
Screenshot 2024-08-05 at 12.50.15 pm

adamhholmes · 2024-08-11T23:16:44.888Z

What exactly is the problem?

mraine8 · 2024-08-11T23:35:10.969Z

Ive attached a quick 1 min recording of the problem.
Essentially I have been playing around with the workflows for a long time and i just cant get it to correctly rearrange the previous order numbers as I need. In the video whatever is wrong with my workflow i end up with multiple order numbers of the same number. I was wondering if you could use the video to have a look at the way i constructed the workflow as you mentioned you’ve done heaps of drag and drop features before. I have the order numbers obviously displayed in the repeating group. Video here: video1504886983.mp4 - Google Drive

mraine8 · 2024-08-20T04:38:34.341Z

Hi all, wondering if anyone has managed to figure this out?

mraine8 · 2024-08-20T05:01:16.065Z

Happy to pay for help over zoom

animisha45 · 2024-08-20T05:26:54.342Z

This is implementing the solution @adamhholmes suggested. Hope the screenshots help.

On the frontend, this is the structure
Screenshot 2024-08-20 at 10.51.43 AM

Workflows 1:

Screenshot 2024-08-20 at 10.53.53 AM1778×698 97.7 KB

Screenshot 2024-08-20 at 10.54.20 AM1714×634 88.6 KB

Screenshot 2024-08-20 at 10.54.38 AM2462×700 134 KB

Workflows 2:

Screenshot 2024-08-20 at 10.55.50 AM1822×690 99.1 KB

Screenshot 2024-08-20 at 10.55.58 AM1740×654 90.1 KB

Screenshot 2024-08-20 at 10.56.07 AM2472×720 135 KB

mraine8 · 2024-08-20T05:55:07.071Z

Thank you so much. that is working mostly perfectly except 2 things. When dragging the first item into the list or swapping something with the last item theres an issue. quick video attached. Please note I have to use data type ‘order number’ in my app - but its the same as index. As you can see changing the middle items works but when I try to drag the first cell or something onto the last cell, things go wrong. thank you so much it seems like im almost there. You can see the order numbers displayed clearly. Video: video1252233078.mp4 - Google Drive

boston85719 · 2024-08-20T07:44:21.135Z

Might be order of operations. The screen shots provided by @animisha45 have the first step to change the index value of the element dragged, then second step is referencing that previous steps result and it’s index, which likely had already been updated.

You might want to setup a custom trigger, which is with action to make changes to list, and in the flow, trigger that custom first step (this is will make it run and complete before next step) and in the next step, make changes to the dragged item index value.