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

Hi @atomparish,
Thanks for your question. :pray:

Yes, you’re right. Also, in this particular setup, we determine the group into which we are dragging and dropping. Depending on the specific group, we select the corresponding field of the desired plugin element.

Please let us know if you need further clarification.

Best regards,
Zeroqode Support Team

I have the same issue! @ZeroqodeSupport any updates on this issue? The new sort order is saving, but there’s a glitchy feel to it as it reverts to the old position for about a second, then the new one.

I’m running into the same issue @atomparish. Were you ever able to figure out how to properly update the field?

How would the solution look if we don’t know the columns of the Kanban board? In my solution I allow the user to define any number of custom states, each of which represents a column. By default this is To Do, In Progress, Done, and Archived, but could theoretically be any number of columns that correspond to their unique workflow. In this case we can’t create workflows for each column because we don’t know what those columns actually are. Any ideas on how to implement something like this?

Hi @2706mason,

We replied on the forum page that you created specifically for this issue :

Apologies again for not being able to help with this issue as the plugin was not designed that way :frowning:

Have an amazing day :pray:

Best regards,
Zeroqode Support Team

Hello Zerocode,
i just recently got this plug in and been trying to make it work, the drag and drop works, although sometimes i have to refresh the page to activate it, maybe is my free plan with bubble, i don’t know.
however i’ve been trying to make the “saving the new order to DB” work, but with no success. I looked at the demo page, i copied all the settings, but still no changed to DB and when the RG refreshes, goes back to the initial order.
attaching 2 screen shot of the workflow and the DB table where i want the changes (order) to change.
any help would be really appreciated!!
Thank you


Hi @marco11

Thank you so much for reaching out.

Would it be convenient for you to add our support@zeroqode.com account to the list of your app collaborators? It will help us to test out the plugin within your environment and find the possible root cause of the issue you have. Please, provide the edit right so we will be able to create a separate test page for this use case (to not interfere with your current application functionalities).

Since Zeroqode is on an Agency plan, it does not matter which Bubble plan your application has. So just ignore the red warning. Go to your Settings → Collaboration.

Hope to hear from you soon :hugs:

Hello and thank you for getting back so quickly, i’ve added you in the collaborator list and you have all the edit rights.
let me know if there’s anything else i should be doing and hopefully you will figure out what i am doing wrong with the plug in. the plug in is in the profile_model page.
Thank you!
edit:
apologies, it’s on the model_edit_setting page

Thank you for adding us as collaborators on your page.

An investigation has been opened about this plugin and our developers will take a look and check the issue at hand.

We will get back to you as soon as we have a fix for it!

Best regards,
Zeroqode Support Team

1 Like

@marco11 Hi

We have finished the investigation of your use case. The plugin is working as it should thankfully. There was a problem with the configuration (filters) of the RG and Dragable Plugin Element that interfered with each other. You are filtering the RG with images only from the user, but in the plugin element, you are showing all the photos.

In sum, when you filter the repeating group that contains only the images of the user, you need to sort the Draggable Plugin Element the same as the RG.

Sorting of the RG:

Sorting of the Draggable Plugin Element (Things and Sort Data):

Summary


You can check the correct plugin work on the test page we created - zq_test.

Hope it helps! :slightly_smiling_face:
Regards,
Zeroqode Support Team

1 Like

Thank you very much! even just copying the same setting as the test page there was something not working, so i decided to start from scratch and redo from zero, now it works perfectly.
I know that the refresh element workflow is necessary, but looks a bit glitchy. was there a solution for it? it’s a minor visual issue, i love how the dragging looks and how all the images follow the action!!! thank you!!

1 Like

We are happy that it worked out for you in the end!

As per the question about the refresh workflow, there is no solution on the plugin side :frowning: A suggestion would be for you to add some transition/animation after the refresh action.

Any other questions you might have, please feel free to contact us here or at support@zeroqode.com

Have an amazing day :hugs:
Zeroqode Support Team

Hello there,

My name is Fabio. I’m using this plugin for dragging&dropping elements in my web-app using the sorting mode.

I found out that, after dragging an element, there’s a kind of flip of the elements for just one second before completing the operation, as shown in the screen-rec below. I find it a bit annoying for the user who will drag&drop elements…is there any way to avoid it? I see that the other plugin called “sortable RG” doesn’t have this issue (but actually there’s a much bigger bug that is → elements change position and go to the previous ones if you refresh a couple of times).

I went to the “reorder RG” plugin demo page and tried to see if it was me or not. And I found out that it works that way so hopefully you can find a way to improve this aspect. In case it’s possible, please let me know :slight_smile:

Unfortunately, using your demo page, I also found few more bugs that I’ve screen-recorded (they’re five short screen recordings) and show below (actually, I think that if I drag elements outside the repeating group, nothing should happen…and currently weird things are happening instead in this case). Notice that I also noticed that these bugs occur randomly…some other times the same action runs properly.

Hello @f.dannunzio92,

Apologies for the late reply. :pray:

The behavior you’re experiencing is related to the “Refresh” action and how it functions. When the plugin executes a refresh, it resets the sorting, and Bubble subsequently inserts a new element. Unfortunately, it’s not possible to avoid it as it’s just how the process operates. Hope for your understanding.

As for the other issues you mentioned, we will check them with our developer team and will keep you updated on any progress. :slightly_smiling_face:

In the meantime, please let us know if we can help you with anything else.

Best regards,
Zeroqode Support Team

Hello @f.dannunzio92,

Thank you for your patience!

We’ve updated the plugin and fixed the issue with the sorting mode. Please upgrade your plugin to the latest version and give it a try. :pray:

Also, please add the following condition in the item moved event:

If you encounter any issues, let us know. It will be a pleasure to cooperate.

Best regards,
Zeroqode Support Team

That’s good.

Anyway, I see that in your live demo if I drag up the first item it still gets moved somewhere randomly. Maybe you still have to update your live demo? or is it still not working properly?

Thanks.

Hi @f.dannunzio92

Yes, we need to deploy our demo page to live. In the meantime, you can check the test version: https://zeroqode-demo-23.bubbleapps.io/version-test/draggable_rg?debug_mode=true

Best regards,
Zeroqode Support Team

Hey all, I need your help on something I’m trying to do.
I’m building an app that uses Xano as a backend.

We have a layout shown in the Screenshot that should have support for Drag n Drop functionality.
Right now, I’m utilizing state and instead of having some array of items, I have separated states for:

colleague_1_full_name
colleague_1_bio
colleague_2_full_name
colleague_2_bio

Update with this approach is really hard and unsustainable because I’m unable to use List since you can have two “John Doe” and Bubble removes duplicates from the list (whatever the reason).

It would be a lot easier to have an array like with objects (data I’m retrieving from Xano API):

[{ firstName: “string”, bio: “string”, contactPerson: “string” }].
I can manipulate that structure whatever I want, but that’s not possible in the Bubble.

My question is, do you have any idea how to do this and do you think this plugin would be adequate for drag-and-drop?
I see Database as an optional parameter in your plugin, but will it work with state data somehow?

Maybe placing a JS element on the page and utilizing an array structure would be beneficial for me.
Sorry if it’s not relevant, I hit a bit of a wall.

1 Like

Hi @saybubble, :wave:

Sorry for the delayed reply. :pray:

At the moment, we have a reduced staff due to the Christmas holidays, but rest assured, we remain dedicated to helping you.

Thank you for reaching out and for providing the details and the screenshot of your app’s layout. We have reviewed the documentation for the “Drag & Drop to Reorder RG” plugin and here’s how it can be applied to your situation:

The plugin is designed to work with Bubble’s repeating groups, which can display a list of items only from Bubble database. It allows users to drag and drop items within the list to reorder them, and this order can be saved back to the database.

Given your setup with Xano as a backend and the data structure you’re using (an array of objects), the plugin can facilitate the drag-and-drop functionality on the frontend. However, since Bubble does not natively handle arrays of objects the same way as a typical backend would, you would need to adapt your Bubble database structure to mirror the array.

Here’s a suggested approach:

  1. Create a new data type in Bubble, for example, “Colleague”, with fields corresponding to the properties in your object (firstName, bio, contactPerson).
  2. When you retrieve data from the Xano API, you can either store it in the Bubble database or manipulate it in states. If you choose to store it in the database, the plugin will work directly with this data.

Regarding duplicates, Bubble’s unique ID for each database entry ensures that even if two entries have the same name, they will still be treated as unique items. So, you can have multiple “John Doe” entries without Bubble automatically removing what it perceives as duplicates.

If you encounter any challenges or need further clarification, feel free to reach out.

Happy holidays. :christmas_tree:

Best Regards,
Zeroqode Support Team.

Hey guys, I completely forgot it’s Christmas on that side of the world. Happy holidays!
When it comes to your idea, I had a similar one but I would love to avoid Bubble database somehow. Especially because I would have to parse data in two directions when the form is opened and then when I’m sending it via Xano API.

I turned on super hard mode, drag n drop, states + Xano. :grimacing:
I’ll try some other ideas, thanks again!

1 Like