[New Plugin] Drag It - Enhance Your Repeating Groups with Drag-and-Drop Functionality: Rearrange, Sort, Reorder, and Transfer Items Between RGs Effortlessly

Hi @chris72
Thank you :pray:

I do not recommend using this method at all because it can cost you money.
Can you explain how you use positions in another plugin?

We have another plugin that is special for working with lists, and one of its features is finding the index of one or more items in a list, which can be useful for you. If you are interested, I can provide it to you for free.

1 Like

Sure! The list I’m working with is for defining certain operations that must be run in a specific order, since some operations may depend on previous operations in the order. The operations are being processed using a custom client-side plug-in that we’re creating since the operations are too difficult to process in vanilla Bubble.

The plugin you linked to looks like it would solve my problem nicely since then I could easily update the position property using the Make changes to a list of things... operation!

Thank you so much!

1 Like

@NoCodeDataArtisan Sorry if this has been discussed previously but just came to my mind and I don’t have the ability to check the whole thread. The plugin does wonders and thank you for all your support and contribution.

Since the plugin stores the new list in a “state”, is it possible to somehow delay the “This DragIt list is updated” event from triggering so we can run the workflow after X seconds for example?

1 Like

@NoCodeDataArtisan Hi. I purchased your plugin to implement the feature of sorting with saving. I’ve read the documentation and managed to understand that saving to the database is facilitated by the “Sorting Updated” flow. However, the problem is that I do not use “list”.

The structure of my DB looks like this:
Data type: Categories
Data type: Products


That is, the user first creates categories, then creates a product and selects a category (from those existing that they created). Categories and products are not linked using “list”.

And in the control panel, there are 2 RGs:
Categories (with a constraint created by this user)
Products (inside the RG with a category) with a constraint: render only those products whose category matches the current category in the table.

I’ve linked your element with these two RGs, and the dragging works. How can I set it up so that it saves to the database, and how can I make it so that after changing the sorting in the control panel, the sorting is also applied on another page? (automatically created for the user)

Thank you very much for the help. The app is already in the live version and has real users. How can I implement this feature without updating the database structure?

1 Like

Hi @akamarski ,

First off, I really appreciate your kind words and am thrilled to hear that the plugin has been helpful to you! Your support and feedback mean a lot. :star_struck:

Regarding your question about introducing a delay before triggering the “This DragIt list is updated” event, while it’s an interesting idea, it does come with its own set of challenges. Implementing such a delay might cause issues, especially in scenarios where items are moved between Repeating Groups (RGs). This is because the state management and synchronization between different RGs can become quite complex, and introducing a delay could potentially disrupt the immediate feedback mechanism that ensures everything is kept up to date in real-time.

However, if your workflow involves operations within a single RG and you’re looking to add a pause before executing subsequent actions, there’s a workaround you might find useful. You can leverage Bubble’s action to add a pause before the next action. To ensure this works seamlessly, it’s advisable to place the action you intend to execute after the pause within a Custom Event.

I hope this clarifies your query and offers a viable solution. Should you have any more questions or need further assistance, please don’t hesitate to reach out.

Best regards,
Mehrdad

Hello @pogozhev.es
Thank you for trusting us and choosing our plugin.

Honestly, this is not possible without changing the structure of the database, but we added a method to the plugin that you can sort the items according to the next item by just adding a field to the table.

In this video, we have shown you how to migrate in this way and the settings required for drag-it.

Bubble.io Tutorial: Migrating to a More Efficient Ordering Method with Drag It! (youtube.com)

Given that you don’t currently have a field to store the order, you can use the creation date or names for the current data.

@NoCodeDataArtisan Thank you for the response! I think this should work. Could you please tell me, since I have 2 data types that I need to migrate, should I repeat the flow as shown in the video twice, just for different data types?

1 Like

No problem,
If you want both to have the sorting feature, you need to do it for both.

@NoCodeDataArtisan I did everything according to the video and RG shows nothing and the console has this error:

Can you please tell me how to fix this?

1 Like

Is it possible to grant me view or edit access to the app editor so I can find the problem quicker?

wrote to DM

1 Like

Hello @NoCodeDataArtisan !

The plugin is great! but I am running into a slight issue. For some reason when I am using the RG → RG feature the drag it believes it is dragging an item that it is not dragging. I am using the sync source as the data type and it usually happens right after you remove one out of the list from the top. Do you know what may be causing this or how to fix it? I have recorded the event below.

https://4e0c9009c485ca8773399d32642396ed.cdn.bubble.io/f1709815096180x195899741736922360/Screen%20Recording%202024-03-07%20at%207.36.14%20AM.mov?_gl=1*x6at47*_gcl_aw*R0NMLjE3MDM2MTk0NDAuQ2owS0NRaUFrS3FzQmhDM0FSSXNBRUVqdUpoYUNrbEtncEV0Z0hWX1k2c3gyZEhBWC04UEdqSVJzcUJKbkJWTV96TFhYWFN5RlpLdWlUc2FBbEFoRUFMd193Y0I.*_gcl_au*MTgxMTg2OTkwNC4xNzAzNTk0NzQ4*_ga*NDAyOTM1MzYzLjE2ODAwMjc1NjE.*_ga_BFPVR2DEE2*MTcwOTgxMzk2Ny40NzAuMS4xNzA5ODE1MDkwLjU2LjAuMA

1 Like

Hello @dbom009
I hope you’re doing well.

Regarding the problem, there is no need to add other actions. Just use 👆DragIt A Sorting Updated and add the action like this:

Hey, thank you for your quick response.

This one was a little more tricky as I was using a filtered list that splits it up into 3 separate RGs and that is what was being moved around.

1 Like

You want move items between them?

However, you don’t need to use other events. Only when saving the list should you glue it together properly.

There are plugins for better list management such as Listopia that you can use

Thanks, the issue is that they need to update in real time. It is moving around tasks into today, this week, etc. If they close the app they need to save and in the correct order.

1 Like

If you use the Sorting Updated event, you can save the orders in real time. The challenge is splitting a list into three RGs.

Hey :wave: @NoCodeDataArtisan,

I’m trying to make a change to a single item when it’s moved from one RG to another.

The workflow is triggering, but it doesn’t appear that any of the custom states are working. i.e. This DragIt’s Added Item is empty. It seems to be the case for just about all of the other states as well.

Any idea where I’m going wrong? I couldn’t find anything in your example app that talks to these functions.

1 Like

Hello @josh24

I hope you’re doing well.

Is it possible to let me access to your app editor?

You can send me the editor link as a private message.

@NoCodeDataArtisan I have a Q about dragit with reusable elements (RE) that within them contain either floating groups (FG) or group focus (GF) elements. When the FG or GF is displayed and you drag the RE( say from position #3 to position #1 it will drag just fine but on drop, the RE at the previous position (#3) shows the FG or GF for the RE that was just dropped to position #1.

I have explored many ways to get the RE to ‘default’ back, on start dragging, such as to toggle/hide a GF/FG but the dragit code doesn’t allow me to reference it this way.

Have you any idea on how I can achieve this?

Gif removed - visually annoying.

1 Like