How to create drag and drop repeating groups in Bubble.io
In this Bubble.io tutorial video we demonstrate how to add drag and drop to your Bubble app. We set up the plugin 'Drag & Drop Repeating Group' by Minimum Studio and show you the first steps needed for creating a kanban board or task manager in Bubble.
Unlock the power of drag-and-drop: Learn how to create dynamic repeating groups in Bubble with this game-changing plugin!
Transform your Bubble app: Discover how to build Kanban boards and project management tools with ease using this amazing drag-and-drop feature.
Elevate your no-code skills: Master the art of reordering repeating groups and take your Bubble app development to the next level!
Introduction to Drag and Drop Repeating Groups in Bubble.io
In this Bubble tutorial video, I'm going to demonstrate how to use this amazing new plugin by minimum studios: drag and drop repeating group. I have tried over the years all of the plugins that supposedly enable drag and drop in repeating groups, and none of them work as well as this plugin. It literally only came out a few days ago, and I can't wait to demonstrate it to you.
Setting Up the Repeating Group
So in my Bubble app, I'm going to add in a repeating group and set it as type contact. Yeah, being able to reorder a repeating group - this is going to be essential if you are trying to build Kanban boards or you're building a project management or task management tool in Bubble. This is just going to add so much to your app.
So we then have columns that's two rows and let's just make this a little bit wider and make rows columns into three. Great, then let's add in some labels to make it a little bit responsive as we go. So this is going to be current cell's contact first name, current cell's contact last name. Make it fill out the sale and great.
Configuring the Data Source
Okay, so for the source, the data source for this repeating group, we can't use a "do a search for" because a "do a search for" hasn't got an order to it. But what we can do is we go on page load and then if I show you here on the page itself, I've already set up a custom state of contacts contact list. So that means that on page load, I can set state of my page contacts, and here is where I can do my search for contacts. And just to show you from a previous demo, I've got this data as a data type contacts - a list of people. Then I can give the data source my custom state, which is my page contacts. Let's preview that.
Implementing Drag and Drop Functionality
Okay, so there are my contacts. Now let's make it drag and drop. So the plugin that we'll be using is this one by minimum studio, and I've already added it into my Bubble app. So I add the elements to the page, and then I need to do a matching up of the HTML ID. So on repeating groups under ID attribute, I can call this RG for repeating group contacts. Copy and paste that into here. I need to add a hash before because it's an HTML ID, and then data type is of contact. Handle would be if you only wanted part of the cell to enable drag and drop, but that looks like I have everything that's needed. Oh, one last thing - in the documentation, they do make it clear that you need to have "show all elements immediately".
Testing the Drag and Drop Feature
Okay, so let's try dragging Peggy Carter to the start. Let's drag Natasha Romanoff there, and we see it's working. So this obviously is really rough in this design in order to make this video quick, but I will do one final thing just to make it work a little bit more nicely by adding a background color. So now I drag it over, it works wonderfully.
Conclusion and Recommendations
I'd really encourage you to go and check out this plugin. I'm just being amazed by it. I've seen on Twitter over the last few days, and you can even do things such as dragging items between multiple repeating groups. Also, there's a method for saving the reordering after you've reordered your cells in your repeating group.
So I might record some future videos on this plugin depending on how well this video goes down, but I just wanted to show you how, having tried so many different Bubble plugins to add drag and drop to my Bubble apps in the past, this one is by far the best out there, and I really rate it. So go and check it out!
The best way to learn Bubble.io?
Start building with total confidence
No more delays. With 30+ hours of expert content, you’ll have the insights needed to build effectively.
Find every solution in one place
No more searching across platforms for tutorials. Our bundle has everything you need, with 500+ videos covering every feature and technique.
Dive deep into every detail
Get beyond the basics with comprehensive, in-depth courses & no code tutorials that empower you to create a feature-rich, professional app.
![](https://cdn.prod.website-files.com/665906e27d14bdd3c329e392/66c49b98fad51f4cba2f57b9_Planet%20No%20Code%20Logo%2023.png)
Frequently Asked Questions
Find answers to common questions about our courses, tutorials & content.
No. Our Beginner Essentials course and AI No-Code Coach are designed for total newcomers. You’ll learn Bubble.io step by step - no coding required.
Simply type your question in plain English, and our AI taps into the entire video library to recommend the exact lessons you need. It’s like having a personal instructor on demand.
As long as you’re subscribed! With our monthly subscription, you get unlimited access to all 500+ videos, our growing course library, and the AI No-Code Coach.
Your subscription includes:
- Bubble Beginner Essentials – Get up and running fast.
- Build a ChatGPT Clone – Integrate AI into your no-code apps.
- Build Your SaaS Website with AI – Learn to create a scalable startup site.
Plus, new tutorials every week!
The AI No-Code Coach is your first stop for instant answers. If you need deeper help, you can book 1:1 Bubble coaching for expert guidance.
Yes! If you don’t see real progress within 14 days, let us know, and we’ll issue a full refund—no questions asked.
Absolutely. Your subscription is month-to-month, and you can cancel anytime—no lock-ins, no hidden fees.
Absolutely. Your subscription is month-to-month, and you can cancel anytime—no lock-ins, no hidden fees.
If you’re serious about building a successful SaaS startup, check out Mastery—our intensive mentorship program. Mastery goes beyond Bubble.io development and includes:
- 1:1 mentorship to fast-track your progress
- Marketing strategies tailored for no-code founders
- Product management insights to scale your startup
- Personalized support from experienced founders