Drag and Drop between Grids

[Russ]

Hi -

I have a page with two RadGrids. Each grid has drag and drop enabled. I use the row-drag capability to re-order items within each grid. The RowDrop event is used on the server side to re-order. It works great.  However, I dont want to be able to drag a row from one grid onto the other grid. Is there a way to prevent draging rows from one grid and dropping them on the other on the client?  If not, is there a way to determine what the "source" grid was in the RowDrop event on the server. The GridDragDropEventArgs class has a DestinationGrid property in it but no SourceGrid property. Is there a way to determine the source grid so I can just ignore any drops from other grids?

Thanks for your help... Russ

[Dimo]

Hello Russ,

You should use the OnRowDropping event of each RadGrid to check whether the dragged items belong to the source RadGrid or the other RadGrid.

http://www.telerik.com/help/aspnet-ajax/onrowdropping.html

function  MyRowDropping(sender, args)
{
    if (args.get_targetItemTableView() && args.get_draggedItems()[0].get_owner().get_owner().get_id() != args.get_targetItemTableView().get_owner().get_id())
    {
        args.set_cancel(true);
    }
}

Regards,
Dimo
the Telerik team

[Russ]

Hi Dimo - Thank you for the suggestion. This method works if both grids have data items already in them. It will return an exception if one of the grids is empty. I think this is because TargetItemTableView doesnt exist if the grid is empty.

I ulitmately used the OnRowDropping client event hooking the function CheckRowDropTarget (shown below) to each of the two grids. This technique was adapted from one of the RadGrid demos...

function CheckRowDropTarget(sender, args) {
  if (sender.get_id() == "<%=rgActivities.ClientID %>") {
     var node = args.get_destinationHtmlElement();
     if (!isChildOf('<%=rgActivities.ClientID %>', node)) {
        args.set_cancel(true);
     }
  }
  if (sender.get_id() == "<%=rgSessions.ClientID %>") {
     var node = args.get_destinationHtmlElement();
     if (!isChildOf('<%=rgSessions.ClientID %>', node)) {
        args.set_cancel(true);
     }
  }
}

function isChildOf(parentId, element) {
   while (element) {
      if (element.id && element.id.indexOf(parentId) > -1) {
         return true;
      }
      element = element.parentNode;
   }
   return false;
}

 

This technique works in all cases, even if the target grid is empty.

Thanks again for your help! -- Russ

 

 

[Sameers]

Thanks, your technique helped me.

I was also encountered with situation when grid is empty and it returnes null for targetItemTableView and others. but using your technique, its working well.

Thanks again for sharing.

Sameers