1

I have one window with an HTML5 draggable element.

When I drag this element to a different window I can receive the event like so.

For instance, the following code allows me to drag an element from the other window and drop it into a the div#draggable. From there I can set it up as a draggable jQuery UI div, where I can use it as you'd expect.

Here is the code which receives this dragged element from the other window:

$('#draggable')
    .bind('dragenter', function (ev) {
        console.log('enter');
        return false;
    })
    .bind('dragover', function (ev) {
        //console.log('over');
        return false;
    })
    .bind('dragexit', function (ev) {
        //console.log('exit');
        return false;
    })
    .bind('drop', function (ev) {
        var dt = ev.originalEvent.dataTransfer;

        var newDraggableElement = $('<span>New Element</span>');
        newDraggableElement.data('stuff', dt.getData('stuff')).draggable();
        $(this).append(newDraggableElement);

        return false;
    });

My question is - is there a way I can trigger the jQuery UI draggable event so I don't have to drop it then start dragging it again?

Hope that all makes sense, cheers.

micbenner
  • 11
  • 1
  • Might help a lot to have a working example someplace. I suspect that you'd have to bind to some event where you clone the element from the source window such that it can then be a part of the DOM in the target window. Meaning that on `dragstart`, the element is cloned and appended to the target, with a position that matches that of the source element. – Twisty Sep 12 '16 at 23:30

0 Answers0