We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

How to implement drag/drop in the spreadsheet

I have written a function moveRows(startRow, endRow, targetRow) that moves the rows of a spreadsheet and adjusts the underlying data.  Now, I would like an easy method for the user to invoke this action, using drag and drop.

For example, let's say the user makes a selection with the mouse, like B11:G15.  I then want the user to be able to drag, or Ctrl+Drag (or whatever), the selection and drop it on a cell in a different row, say A2.  As a result of this action, I would call moveRows(startRow : 11, EndRow: 15, TargetRow: 2) which would perform the actual manipulation of the spreadsheet and underlying data.

How can I enable the drag/drop of the selected range?

2 Replies

JO John March 15, 2023 09:51 PM UTC

I'm thinking that I need to add draggable="true" to the selection div..

<div class="e-selection" style="top: 139px; height: 101px; width: 93px; left: 110px;"></div>

along with the appropriate ondragstart, ondragover, ondrop events.

But I'm not clear on how to do that without interfering with the spreadsheet.


SP Sangeetha Priya Murugan Syncfusion Team March 16, 2023 08:54 AM UTC

Hi John,

Currently, we don’t have support for drag and drop in spreadsheet. However, we have already considered this as a feature, and it will be available in any of our upcoming releases. You can track the status of this feature using below link from our feedback portal,   


Feedback Link:



Sangeetha M

Live Chat Icon For mobile
Up arrow icon