Getting hold of source object in the context of using FancyTree (JS) and jqueryUI droppable

Question

We are using

https://github.com/mar10/fancytree

with its drag and drop extension.

Users can drag and drop a node into a DIV marked using jqueryUI as droppable. Inside the 'drop' handler I see the (event, ui) parameters but I could not figure out how to get hold of the source node being dragged.

According to jQueryUI documentation the information would be available using

$(ui.draggable)

but I can not find any useful information (console.log).

I only see something like

[div#tree, selector: "",....]

on the console.

I need to get hold of the original 'title' and 'key' attributes of the related Fancytree node.

How to do that?

Answer 1

You can retrieve the original source node like this:

$(".droppable").droppable({
    drop: function(event, ui){
        var sourceNode = $(ui.helper).data("ftSourceNode");
        alert("Dropped source node " + sourceNode);
    }
});