View Full Version : Drag and drop issue with links in a grid

22 Mar 2016, 8:12 AM

I have drag and drop working from a grid to a tree. The items in the grid also have links and when the user tries to drag from those links the browser takes over and activates its own drag and drop functionality where it thinks you're trying to save or open that link in a new tab.

Is there a way I can override this functionality so that dragging the item works even from links? I have a fiddle below that may illustrate this issue better. Notice that it works when dragging from anywhere on the grid that isn't a link, however, when dragging from a link it thinks you're trying to save or open that link in a new tab.


Gary Schlosberg
22 Mar 2016, 8:43 AM
I'm not sure that the gridviewdragdrop plugin is intended to work with links. As you mentioned it seems like the browser is taking over when it detects a link. I'm not sure how you would affect the link in a way that defeats this functionality without rendering the link unclickable before or after the drag.

22 Mar 2016, 9:32 AM
Could it be possible to disable the browsers dragstart event on hyperlinks and try and bubble it down to the gridviewdragdrop plugin?

Something along the lines of:

[].forEach.call(document.querySelectorAll('a'), function(el) {
el.ondragstart = function() { return false };

I'm just not sure how I would go about this route.

Another solution I'm thinking of would be to disguise the text as a hyperlink where we handle the click event ourselves so the browser will not interfere with the dragging functionality. However, I do not think this would be feasible in my current situation.