> For clean Markdown of any page, append .md to the page URL.
> For a complete documentation index, see https://docs.doc-detective.com/llms.txt.
> For AI client integration (Claude Code, Cursor, etc.), connect to the MCP server at https://docs.doc-detective.com/_mcp/server.

# dragAndDrop

> Reference for the `dragAndDrop` schema.

## Referenced In

* [Markup definition](/reference/schemas/markup-definition)
* [test](/reference/schemas/test)
* [Resolved context](/reference/schemas/resolved-context)

## Fields

| Field       | Type                                                  | Description                                               | Default |
| :---------- | :---------------------------------------------------- | :-------------------------------------------------------- | :------ |
| dragAndDrop | object([dragAndDrop](/reference/schemas/draganddrop)) | Required. Drag and drop an element from source to target. | —       |

## Examples

```json
{
  "dragAndDrop": {
    "source": "Table",
    "target": "#canvas"
  }
}
```

```json
{
  "dragAndDrop": {
    "source": ".draggable-block",
    "target": ".drop-zone",
    "duration": 2000
  }
}
```

```json
{
  "dragAndDrop": {
    "source": {
      "selector": ".widget",
      "elementText": "Data Table"
    },
    "target": {
      "selector": "#design-canvas"
    },
    "duration": 500
  }
}
```

```json
{
  "dragAndDrop": {
    "source": {
      "selector": ".draggable",
      "timeout": 10000
    },
    "target": {
      "elementText": "Drop Zone",
      "timeout": 5000
    }
  }
}
```

```json
{
  "dragAndDrop": {
    "source": "/Widget Item.*/",
    "target": "#canvas"
  }
}
```

```json
{
  "dragAndDrop": {
    "source": {
      "selector": ".draggable",
      "elementText": "/Button [0-9]+/"
    },
    "target": {
      "elementText": "/Drop Zone.*/"
    }
  }
}
```