Move repeating group items up and down the group

Hi Guys,

I’ve got this problem which I have worked on for about 12hours without any success. Funny enough it seems simple, but don’t know why I can’t figure it out.

I have created a meal planner. Users can send meals to a plan. So there’s a user data type as usual and a plan data type. There is also a meal datatype.

When the app loads, a default one-week plan is created for the user(so that empty default plan is just a list of dates from Monday to Sunday) A user can add a meal to the plan which automatically takes the next available date. So basically, a user’s plan is a list of meals that have dates. So when the plan is displayed, it’s something like this:

I want to create a possibility for the user to move a meal to a different date by using the up and down arrows. Basically only the dates need to interchange when you click the up arrow because all the user will be doing is moving a meal to a different date. The group is already sorted by date.

I have tried everything but it’s not working.
To get the top button to work first ,I have tried saving the unique id of the parent group in a state and then changing the date of the previous row using ‘change a thing’ and then triggering a workflow to change the parent group’s date using the state which i had saved. not working

Hey @lancegerarrd :wave:

Thanks for the post! I love figuring out challenges like this.

If I had to build something like this, here’s what I’d try… Since you know which cell’s arrow is being clicked, you know it’s index number in the repeating group which means you can also reference the item one up or down. I’d probably build this as a backend workflow so I can see all the values I’ll need to interact with in the workflow using parameters.

So in your case, I might set parameters for Meal, Other meal, New date, Current date. Passing the meal is easy because it’s the cell that was clicked. For other meal, if the up arrow was clicked, you’ll do repeating group’s list of meals item number (with the item number being the index of the clicked cell - 1). Current date is the meal’s date, new date is the other meal’s date. From there, in your backend workflow it’s a simple matter of building the actions to swap the two meals to the two dates.

I recognize I might not know all the data types or considerations involved here and it might take some adjustments, but I think that’s the route I’d take. Give it a try and feel free to reach out to us directly with any additional questions → Support@Bubble.io

1 Like

Thanks for the reply @Andrew.Vernon . I’ll try something like that and get back to you.

@lancegerarrd Sounds like a plan! And, best of luck. Curious to hear how it goes for you.

Hi Andrew,

So I read your advice again and I think you pretty much understood exactly what I’m trying to achieve. Now there are some things which I think might be stopping me from achieving that. these are:

Firstly the current cell index. what is it really?(because to swap dates one has to change the date of one cell, then the other. does that affect the current cell index if cells are sorted by date?), secondly. the squence in which the change will happen affects the whole thing. I’ve been testing but it looks like the sequence in which bubble runs the changes happen are conflicting and creating a mess.

I suggest to create a new field called ‘place-date’, when button is clicked > change the current cell ‘place-date’ to current date/time > sort the RG by ‘place-date’ to yes

Quite easy, I’ve done that with an attribute “position” which is a number, instead of a date, for my RG to have the feature of sending the items up and down.
In your case, I believe we could use the same logic but with the date attribute. Try the following:
When clicking the down arrow, create a workflow with 2 actions, the fist one will make a change to the next item in the list, to find the next item take the list of the RG and use “current thing index + 1” inside an arbitrary text, now change it’s date to be the current item’s date.
Similar to this

Now we’re going to change the date of the current item with the second action, make change to the current item and set its date to be the date of the next item in the RG, to find the next item take the list of the RG and use “current thing index + 1” inside an arbitrary text.

Do the same logic for the other arrow, inverting the direction.

2 Likes

Hi @jizreel_alencar,

You lost me at the second part where you changed the second item. I thinking that you must have made a mistake there. Anyway, what I really needed was the part with the arbitrary text. Now it’s working, but for some reason, the database gets changed but is not reflected on the app untill i scroll or refresh the page. Don’t know what I can do about that.

Thanks again.

Hey @lancegerarrd

Glad to see some other users were able to jump in and help get you situated over the weekend! That’s great. You’re right about changing one updating the sort order of the RG. This is why I suggested handling this as a backend workflow where you sent those 4 parameters. The backend workflow wouldn’t be thrown off by the repeating group changing it’s order because it would already have the values by the time it started to make changes.

You could technically handle this on the front end as well and if you wanted to do it that way, I would use custom states to store the two values that are changing places and maybe atleast one of the dates. That way, as you begin to make changes, you don’t lose your abilility to easily reference the items you’re working with like you described.

Give it a try and don’t hesitate to reach out with any additional questions to Support@Bubble.io

1 Like

This topic was automatically closed after 70 days. New replies are no longer allowed.