how to get target grid cell with drag and drop

[Myo]

Hi ,

how can i get target grid cell index or row key when i drag and drop my cell with same grid. I have attached screen shot and sample code below. Any help will be appreciated.

 var dragging = false;
            var dragContainer = null;
            var currentDraggedElement = null;

            function onColumnCreated(sender, args) {
                // hook to columns mousedown event;
                $addHandler(sender.get_element(), "mousedown", onMouseDown);
            }

            function onGridCreated() {
                // hook to columns document's events
                $addHandler(document, "mouseup", onMouseUp);
                $addHandler(document, "mousemove", onMouseMove);
            }

            function onMouseMove(e) {
                if (dragging && dragContainer) // if in drag mode move the dragged container
                {
                    dragContainer.style.display = "";
                    dragContainer.style.position = "absolute";
                    Telerik.Web.UI.Grid.PositionDragElement(dragContainer, e);
                }
            }

            function onMouseDown(e) {
                //create the dragged container
                dragging = true;
                dragContainer = document.createElement("div");
                dragContainer.style.position = "absolute";
                dragContainer.style.zIndex = 99999;
                dragContainer.style.display = "none";
                document.body.insertBefore(dragContainer, document.body.firstChild);

                var currentElement = Telerik.Web.UI.Grid.GetCurrentElement(e);

                //get parent row element then get the OnwerTableView in order to get objects for the column            
                var row = Telerik.Web.UI.Grid.GetFirstParentByTagName(currentElement, "tr");
                if (row.id == "")
                    return;

                var item = $find('<%=grdAvailability.ClientID%>').get_masterTableView()._getRowByIndexOrItemIndexHierarchical(row)

                var ownerTableViewId = item.id.split("__")[0];
                var ownerTableView = $find(ownerTableViewId);

                if (!ownerTableView)
                    return;

                currentDraggedElement = currentElement;//store the current cell as we will need it inside the mouseup event                    
                dragContainer.innerHTML = currentElement.innerHTML;
                Telerik.Web.UI.Grid.ClearDocumentEvents();
            }

            function onMouseUp(e) {
                if (dragging) {
                    // get the element that you are dropping on 
                    var currentElement = Telerik.Web.UI.Grid.GetCurrentElement(e);
                    if (dragContainer !== null && dragContainer.innerHTML !==null) {
                        currentElement.value = dragContainer.innerHTML;
                        currentDraggedElement.isDragged = true;
                        PageMethods.GetReservationKeyWithDocNo(dragContainer.innerHTML,
                                                       function (result) {
                                                           if (result !== null) {
                                                               url = '../Reservation/Update/NewMoveReservation.aspx?RK=' + result;
                                                               ShowRadWindow('Move Folio', url, 650, 530)
                                                           }
                                                       }, function (e) {
                                                           alert(e.get_message);
                                                           $telerik.$.unblockUI();
                                                       });
                    }
                   
                   
                    Telerik.Web.UI.Grid.RestoreDocumentEvents();
                    document.body.removeChild(dragContainer);
                    dragContainer = null;
                    currentDraggedElement = null;
                }
                dragging = false;
            }
            function onGridDestroying() {
                $removeHandler(document, "mouseup", onMouseUp);
                $removeHandler(document, "mousemove", onMouseMove);
            }

[Eyup]

Hi Myo,

You can use the client-side drag events provided by RadGrid to get this information:
http://www.telerik.com/forums/drag-and-drop-from-radgrid-to-radtreeview#VZKc3Xmg-kSjX7n9ea6o1A

Hope this helps.

Regards,
Eyup
Telerik