Drop draggable data/rows into Fancytree?

Question

I need the ability to drag and drop data from outside the Fancytree into the tree and save it. I have the key and title for any droppable (row) available but how can I add this to the tree exactly where the user drops it?

http://jsfiddle.net/nwntpd15/5/

$("#tree").fancytree({
        rootVisible: false,
        checkbox: false,
        selectMode: 1,
        clickFolderMode: 4, 
        debugLevel: 0, 
        source: [
            {title: "Node 1"},
            {title: "Node 2", key: "id2"},
            {title: "Folder 3", folder: true, children: [
                {title: "Node 3.1"},
                {title: "Node 3.2"}
            ]},
            {title: "Folder 2", folder: true}
        ],
        extensions: ["dnd"],
        dnd: {
            autoExpandMS: 400,
            focusOnClick: false,
            preventVoidMoves: true, // Prevent dropping nodes 'before self', etc.
            preventRecursiveMoves: true, // Prevent dropping nodes on own descendants
            dragStart: function(node, data) {
                return true;
            },
            dragEnter: function(node, data) {
               return true;
            },
            dragDrop: function(node, data) {
                /** This function MUST be defined to enable dropping of items on
                 *  the tree.
                 */
                data.otherNode.moveTo(node, data.hitMode);
                /**/
                return false;
            }
        }
    });

    $( ".drag").draggable();

Answer 1

An example might look like this:

    var count = 1;
    $("#tree").fancytree({
        ...
        dnd: {
            ...
            dragDrop: function(node, data) {
                if( !data.otherNode ){
                    // It's a non-tree draggable
                    var title = $(data.draggable.element).text() + " (" + (count)++ + ")";
                    node.addNode({title: title}, data.hitMode);
                    return;
                }
                data.otherNode.moveTo(node, data.hitMode);
            }

Answer 2

Solution including jQueryUI draggable. Thank you @mar10 for your contribution, it pointed me in the right direction (now to get this to work for Datatables). http://jsfiddle.net/nwntpd15/13/

$(".draggable").draggable({
  revert: true, //"invalid",
  cursorAt: { top: -5, left: -5 },
  connectToFancytree: true,   // let Fancytree accept drag events
});