SpreadJS supports using the mouse to drag and move cells, cell ranges, and cells in tables. You can move the mouse pointer to the edge of a selected cell, column, row, or cell range and then click and drag the selected range to the new location.
The following table depicts the operation and events available in a Spread worksheet:
| Operation | Cell | Table |
|---|---|---|
| Drag | Cut Paste | Cut Shift Cells Down |
| Drag + Ctrl | Copy Paste | Copy Shift Cells Down |
| Drag + Shift | Cut Shift Cells Down | Cut Paste |
| Cut Shift Cells Right | ||
| Drag + Ctrl + Shift | Copy Shift Cells Down | Copy Paste |
| Copy Shift Cells Right |
You can allow or prevent drag-drop operations by using the spread option allowUserDragDrop. It accepts a boolean value and has the default value of ‘true’, allowing drag-drop of the selected cell or range of cells in an active sheet or in a table.
The following code sample shows how to disable the drag and drop of cells in a worksheet.
| JavaScript |
Copy Code
|
|---|---|
var spread = new GC.Spread.Sheets.Workbook(document.getElementById("ss"),{sheetCount:3}); var sheet = spread.getActiveSheet(); // Disable drag and drop of cells spread.options.allowUserDragDrop = false; |
|
The following actions cannot be performed when using the drag-drop operations:
- Dragging cells into a pivot table area.
- Dragging multiple ranges.
- Shifting cells that affect a table or pivot table.
- Shifting cell ranges in a table where the cell range is not the same size as the table area.
Cell Operations
The following drag and drop operations can be performed to a cell or cell range in SpreadJS.
| Operations | Example |
|---|---|
| Drag |  |
| Drag + Ctrl |  |
| Drag + Shift |  |
| Drag + Ctrl + Shift |  |
Table Operations
The following drag and drop operations can be performed to a table cell or cell range in SpreadJS.
| Operations | Example |
|---|---|
| Drag |  |
| Drag + Ctrl |  |
| Drag + Shift |  |
| Drag + Ctrl + Shift |  |