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

Hi @NoCodeDataArtisan ,

Is there an example in your playground of how we can use the plugin outside of a repeating group? e.g. let’s say I have a list of 4 groups/divs on my page that I want the user to be able to re-order and save that list on the user.

Does your plugin lend itself to this functionality? I have seen the option for “Use on non-RG” but I cannot find documentation/examples of how this works.

There is no need for me to have this in a repeating group because the groups are just static content, I just want me user to re-order them as they wish.

Great plugin by the way, I am using it lots!

1 Like

Hello @rjwilkinson10,

Thank you for using our plugin and we are glad that we were able to get your satisfaction. :star_struck:

Regarding the question you asked, yes, you can use Drag It on simple groups and even move items between multiple groups.
But be careful that the inner groups must have data, even a number or a text. This is because of that we can mark them in Drag It and tell you about their sorting order.


In fact, we have not specifically created an example for this case, but in the “Use Case” tab of demo, one of the Drag It has been applied to a normal group.

If you pay attention, there we have put the data type of all the Drag Its as text and we used a combination of simple group and repeating groups so that the user can create his own list and then we have a list of text at our disposal.


Data-visualization-plotly | Bubble Editor

1 Like

Hey guys,

Love this plug-in. It’s actually the first one I’ve used that I’ve actually been able to get working correctly…almost. Hopefully, you can help me with this one problem I’m having.

So, I’m building a habit tracker. On the tracking page, I have a repeating group listing routines. These routines are rendering and reordering perfectly. Each routine in the list expands to show a repeating group listing the habits in the routine. With this, only the first routine in the routines list is rendering its habit list. The second and third routines are not rendering their habit lists. Upon investigation I’m finding that on the second and third routine habit lists, the list data that should be passed by the plug-in is showing “empty”.

I hope that’s enough information to make my situation clear. If not, please ask me whatever you need to understand.

I’ve noticed you guys have been great with supporting your plug-in and I’m looking forward to hearing from you with any help you can offer.

Thanks!

-Jack

1 Like

Dear Jack,

Thank you for reaching out and sharing your positive experience with Drag It! We’re glad to hear that it’s been largely successful for you, and we’re here to assist with the issue you’re encountering.

Based on your description, it seems like there might be a few adjustments needed to get your habit tracker working as intended. Here are some suggestions that might resolve the issue with the habit lists not rendering correctly in your second and third routines:

  1. Check “Show All Items Immediately” on Repeating Groups (RGs): Ensure that this option is enabled for your repeating groups. This setting can sometimes affect the rendering of lists, especially in nested or complex structures.

  2. Insert ‘Drag It’ for Inner Repeating Groups: For your inner repeating groups (the ones listing the habits within each routine), make sure to insert the ‘Drag It’ element in the cell of the routine repeating group, just like you did for the inner repeating groups.

  3. Set Different IDs for Inner Repeating Groups: It’s important to have distinct identifiers for each repeating group. Avoid using the data unique IDs, as they can sometimes lead to conflicts or incorrect data passing between Drag Its.

  4. Sharing Items in Inner ‘Drag Its’ for Habit Movement: If your design involves moving habits between different routine, ensure that all habits are included in the ‘share items’ settings for the inner ‘Drag Its’. This ensures proper tracking and interaction between different elements of your tracker.

Hopefully, these steps will help resolve the issue. If you’re still encountering problems, please don’t hesitate to provide more details or any specific configurations you’re using, so we can assist you further.

We appreciate your support and are committed to ensuring a smooth experience with our Drag It plug-in.

Best regards,
Mehrdad

Hi @NoCodeDataArtisan ,

For some reason the plugin is causing all files on the page to be downloaded if there is a file downloader on the same page.

How to resolve this issue?

Hey @ahmed.khodeir.87

Could you please explain more about this issue?

Hi @NoCodeDataArtisan
So 1st of all it is not related to the file downloader actually, because I just removed the file downloader from the page and yet the files were downloaded.

So let me explain more…

The repeating group consists of sections, each section could represent ( text, file URL, image URL, etc. ) , and now I have 10 sections in this RG, when I try to reorder the RG when I have one of the sections ( file URL ), it downloads that file.

So if the user added a file section, and then decided to arrange the sections, every time he drag an element, that file get downloaded.

Hope I didn’t confuse you more.

1 Like

I don’t know if I understood correctly or not!
But maybe adding a handle can solve your problem. And to put the handle in such a way that it does not download by clicking on it.

@NoCodeDataArtisan ,

I have a handle to re-order the sections, I think the reason might be that every time the Dragit plugin gets triggered it somehow renders all the repeating group’s elements, so when it renders an element that has a file URL it downloads it.

This still makes no sense, because my RG elements have images, and video URLs too, so why it only download the files (i.e. Zip file ) and not the images and videos :thinking:

This is strange!!! :face_with_monocle:
Drag It has no access or connection with application files.

Can you provide a video or some screenshots? Can we access the live page?

Is there a way to insert an item at a specific point in the list? For example, if I’m creating a checklist and want to allow the user to manually re-order items, can I also allow them to insert a new item midway through the list, or do I have to force them to first add it to the end, then manually drag it up to where it’s supposed to go?

1 Like

Hello @2706mason ,

You’re absolutely right to having this feature.
Actually, this is more related to bubble itself and it can be achieved by splitting the list at the desired point, adding your new item, and then merging the list back together.

‘Drag It’ will then display the updated list just as it would with a regular repeating groups.

However, I’d also like to introduce you to our other plugin, ‘Listopia’, which might make this process smoother for you. ‘Listopia’ is designed to handle more complex list management scenarios. It not only allows easy insertion of items anywhere in the list but also offers additional features like filtering and sorting. These functionalities can be particularly useful if you’re dealing with more dynamic or extensive lists. You can check out these features in action on our demo page.

Drag It - Kanban with Filtering (+Listopia)

Drag It - Kanban with Filtering (+Listopia) | Bubble Editor

We’re committed to making your experience as seamless and efficient as possible. If you have any more questions or need further assistance, please don’t hesitate to reach out. We’re here to help!

Best regards,
Mehrdad

1 Like

Hey @bravo, how’s it going?

I’m here to help you get the most out of Drag It. I noticed that your app is a bit different from the usual apps using Drag It, but don’t worry, it’ll work just fine.

I’d appreciate it if you could let me access to your app editor to make the process quicker and easier. Just send me a message with link of the app editor (it could be another app that has the same features as your real one) and set the correct privacy mode.

If it is not possible, no big deal, we’ll still guide you through the setup process and make it happen together. :cowboy_hat_face:

Best,
Mehrdad

Hi @NoCodeDataArtisan ,

I am not sure what’s happening but the Drag-It plugin is not working in Chrome. It is working on my mobile app but when I try to re-order images in an RG using Chrome, it doesn’t let me drag. Seems to be like this for about a week now.

Have you/anyone else experienced this?

Regards

Julian

1 Like

Hi Julian,

Thank you for reaching out and informing us about the issue. We appreciate you taking the time to report this.

So far, we haven’t received similar reports specifically about the Drag-It functionality in Chrome. However, some users have mentioned experiencing unusual behaviors with other aspects recently. This suggests there might be an underlying issue we need to investigate.

As a troubleshooting step, could you please try downgrading to the previous version of the plugin and see if the problem persists? This information would be incredibly helpful for us to understand the issue better.

Thank you for your cooperation and understanding. We are committed to resolving this as quickly as possible and ensuring a smooth experience for you.

Best regards,
Mehrdad

Hi Merdad,

Many thanks for the response. Not sure if you updated anything but this evening it just started working on Chrome again. I was about to go in and rollback the version and thought I would check again and it was working. Not sure this helps you in any way to identify the cause but I am just happy it is back up and running again.

Kind Regards

Julian

1 Like

Hi Julian,

I’m glad to hear that everything is working smoothly for you. It’s always a relief when technical issues resolve themselves. :sweat_smile:

While the exact cause might remain a mystery, the most important thing is that you’re back up and running.

If you encounter any other issues or have questions in the future, don’t hesitate to reach out. Your feedback and experience are invaluable to us.

Best Regards,
Mehrdad

Please @NoCodeDataArtisan !

Is it possible to try, test, or experiment in my project context with this API “Drag It - RG → RG” before buying?

1 Like

Hi @hugokml

We offer subscription plans for all our plugins so you can try them out for a short period (even a few hours) and pay only for what you use. It’s almost like getting them for free. If you like them, you can buy them once or keep subscribing.


You can also test Drag It (and other plugins we have) in this app and make a sample of your project. :point_down:


If you haven’t upgraded yet and want to test it in your own app, just send me your app ID and I’ll enable the plugin for you so you can add it to your app as a free plugin.

Hi @NoCodeDataArtisan … Nice! I appreciate your attention and support.

Here is my project id: rmoactual

1 Like