> For the complete documentation index, see [llms.txt](https://docs.airdev.co/canvas-pages-and-modules/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.airdev.co/canvas-pages-and-modules/master-1/modules/drag-and-drop-repeating-group.md).

# Drag and Drop Repeating Group

## Overview

This fully-responsive and fully-functional module contains a repeating group with draggable groups and droppable zones. Users can easily sort the list by dragging and dropping a group to a different location. cc

![](/files/-Lcg_hJ-zSnRXVGdA7Cb)

## Structure

* When this module is added to a page, it is placed within a group called `Group page860Group` on the page. This group contains the responsive settings for all modules.
* This module `Group DragAndDropRG` contains three main groups:
  * `Group verticalPadding 1` - For responsiveness (please do not delete)
  * `Group verticalPadding 2` - For responsiveness (please do not delete)
  * `Group 780StandardGroup` - If you add more elements to the group, please ensure that they are contained within this main content group.
* This module has a reusable element inside of it called `draggableRepeatingGroup`. 
  * This reusable element contains all of the logic and drag and drop UI for the module:
    * `DroppableGroup` - This is the group that users can drag to a different location
    * `Dropzone` - This is the group where users can drop the `DroppableGroup` (for order numbers after #2)
    * `DropArea` - This is the group where users can drop the `DroppableGroup` (and move the dragged group to #1)
  * All data is displayed in `RepeatingGroup dummy (draggable)`

## How to set up

![](/files/-Lcg_qV5GBSlGZPNddX7)

* Remove or add workflow to `Button ADD`
* Open the `draggableRepeatingGroup` reusable  and update the data source of `RepeatingGroup dummy (draggable)`
* Update the data source of the texts