↪ Drag & Drop to Reorder RG - New Plugin from Zeroqode

This plugin allows you to easily embed a repeating group where cells can be sorted by dragging and dropping in a swap and handle modes. Cells can be moved both within a single repeating group as well as between 2 different repeating groups with changes saved in the Bubble database. Smooth CSS animation makes your UI friendly and nicer.

Features:

  • Moving items between 2 databases. Drag a cell from one RG into another RG, and the database will be changed accordingly.
  • Deleting items when dragging outside the RG area. It’s possible to enable/disable deleting via plugin action
  • Sorting. Reorder the RG, and the order will be reflected into another RG automatically
  • Supports both list and grid style layouts.
  • Swap mode
  • Drag Handle mode
  • 6 animation styles
  • Highlighting the dragged cell and drop area
  • Animation speed of dropping items in a group
  • Supports touch devices.

RG_GIF

Live demo: https://zeroqode-demo-23.bubbleapps.io/draggable_rg

DEMO & DOCUMENTATION

Levon Terteryan
Founder @ Zeroqode
#1 Bubble Publisher and Developer

logo-icon-S-circle

100+ Bubble Templates
25+ Bubble Courses
250+ Bubble Plugins
20+ Bubble Building Blocks
Convert Web to iOS & Android
No-code Development Services
Zero Code Conference Replay - watch all the no-code industry leaders share their expertise and insights on building and scaling startups without code

4 Likes

Interesting!

But I’m not able to try it…
2021-07-06 19.35.30

Hey, @rico.trevisan !

Thanks for reaching out!

I’m afraid there has been a little mix-up :speak_no_evil: . Could you please try it out again? :slightly_smiling_face:

Thank you for pointing that out :pray:

Best,
ZQ Team

It works now.

3 Likes

Glad to hear that :slightly_smiling_face: If you have any questions, feel free to contact us :wink:

Cheers,
ZQ Team

It’s not working very well for me either…

Can’t get it to do anything.

1 Like

Also, how does it save the order to the database? Can’t seem to find that detail.

@levon any support available?

Hello, @stayshure
Thanks a lot for reaching out and sorry for our late reply :pray:

First of all, please allow us to recommend you to check the ID Attributes within the Plugin’s element and the Repeating Group:


Additionally, please check the Data Source for the Repeating Group. As we can see from the recorded video, you are using “Current cells List”. Repeating group Data Source = the database table on which you are doing your search. It means you should indicate the Do a search for database table name as a Data Source of your Repeating group.

Please try it and let us know if it works now.

In case of the negative result for the Handle option, kindly ask you to provide us the screenshots of all settings for the Repeating Group and the plugin element.

Looking to hear you soon.
Best regards,

Wow, I feel dumb, haha. I accidentally added the ID to the group the RG was in, not the RG itself.

Thanks Levon!

  • Alex

@levon That leads to my next question; is the anyway to make this change the database, not just the RG? When I change the datasource, the items are still moved and when I refresh the page they are put back. Defeats the purpose of using it to reorder

1 Like

Hello, @stayshure
Glad that our advice was helpful for you.

Please allow us to mention that for these purposes the plugin includes the Sorting Mode option. Cells can be moved both within a single repeating group as well as between 2 different repeating groups with changes saved in the Bubble database.
You can reorder fields in the RG and after refreshing the page - the result will remain. Please find our screencast:

Please check our Demo Page and just replicate all the settings for the element:

Hope it will help you.
Best regards,
Zeroqode Support Team

A video demonstrating how to set this up would be great! The documentation is lacking.

Does this work on Microsoft Edge? I’m looking at the demo and very few options work (add items and swap mode). And also with great effort actually dragging the item. Only works using the mouse. My laptop has a touch screen and nothing works using the touch.

Hello, @martin101
Thanks a lot for reporting the issue.

Please allow us to investigate the reason for reproduced issue on the Microsoft Edge browser and to revert with a response.

Thanks for the understanding.
Best regards,
Zeroqode Support Team

Hello, @martin101
Thanks for your time and patience.

Please allow us to mention that we have checked the plugin processing on the Microsoft Edge browser and now, it works properly.
You can use the plugin with both mouse and touch screen tools.

Please check it and let us know about the result :pray:
Best regards,
Zeroqode Support Team

1 Like

Works fine now. Good job.

2 Likes

Getting this error. Can you help?

The plugin Drag & Drop to Reorder RG / element Dragable RG threw the following error: @https://dhtiece9044ep.cloudfront.net/package/run_debug_js/71fd465ce5ff447575861df76f39c64a957abb284574861639b3174a69a666c8/xfalse/x15:6:2370375
@https://dhtiece9044ep.cloudfront.net/package/run_debug_js/71fd465ce5ff447575861df76f39c64a957abb284574861639b3174a69a666c8/xfalse/x15:6:2371464
ie@https://dhtiece9044ep.cloudfront.net/package/run_debug_js/71fd465ce5ff447575861df76f39c64a957abb284574861639b3174a69a666c8/xfalse/x15:6:989695 (please report this to the plugin author)

It’s set up correctly as far as I know:

but when it goes to filter by item’s unique id it’s blank:
image

Hello @letsexecute

Thank you for reaching out.

Can you please provide more details on when exactly you are getting this error? Also, it would be helpful to understand what you are trying to achieve with this plugin, and if possible provide additional screenshots or video recordings of the plugin element and the repeating group. It will help us to understand your issue better and help to resolve your issue.

Looking forward to your reply.

Regards,
Zeroqode Support Team

este plug in funciona con el nuevo responsive?