|Visual Studio version
2005 / 2008
all browsers supported by RadControls
The example demonstrates how to drag and drop a grid row between grid instances and how to delete a grid row (dropping it onto a div "masked" as a recycle bin).
Note that the two grids should have the same column structure, Skin="None" and predefined style settings (Styles.css) because the handlers and appearance are related with them. Event handlers for onmousedown, onmouseover
(browser-dependant) for every row and onmouseup
for the document are hooked inside the RowCreated
client-side event handler.
After dragging (mouse down, mouse move, mouse over and mouse out) and dropping (mouse up) a request to the server is made with the following arguments:
- the ID of the source grid
- the index of the dragged row
- the id of the grid/div the row is being dropped over
- the index of the target row (where we dropped the dragged row in the destination grid -- we will insert the dragged row before the target row in this example)
On the server the row is accessed by its index and the current page of the grid which holds it. If the row is dropped on the recycle bin, it is deleted from the grid it came from. If it is dropped over the other grid instance, it is removed from its original grid and is inserted at the supplied index in the destination grid structure.