在两个 Fancetrees 之间拖放答案

【问题标题】：Drag & Drop between two Fancetrees在两个 Fancetrees 之间拖放
【发布时间】：2016-08-19 23:06:18
【问题描述】：

有没有办法将 2 个 Fancytree 组合在一起，使 Fancytree A 是一组固定的配置项，Fancytree B 是一个配置文件，并且 Fancytree A 中的项目可以拖放到 Fancytree B 而不会在树 A 中消失。在 Fancytree B 中拖放也应该是可能的。

我已经搜索了一段时间，但没有找到我想要的东西，所以也许有人知道如何做到这一点！

【问题讨论】：

标签： javascript jquery fancytree

【解决方案1】：

绝对可以使用标准功能从不同的树甚至标准的 jQuery Draggables 拖放节点。

基本上你使用相同的 API

        $("#tree").fancytree({
            extensions: ["dnd"],
            ...
            dnd: {
                ...
                dragStart: function(node, data) {
                    if( data.originalEvent.shiftKey ){
                        console.log("dragStart with SHIFT");
                    }
                    // allow dragging `node`:
                    return true;
                },
                dragEnter: function(node, data) {
                    // Prevent dropping a parent below another parent (only sort
                    // nodes under the same parent)
/*                  if(node.parent !== data.otherNode.parent){
                        return false;
                    }
                    // Don't allow dropping *over* a node (would create a child)
                    return ["before", "after"];
*/
                   return true;
                },
                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);
                }
            }
        });

示例浏览器包含Examples - Test - Drag'n'Drop下的demo

【讨论】：