在两个dyna发辫之间抛弃拖拽

时间:2015-06-24 10:26:10

标签: jquery-dynatree

我有两个Dyna发辫。想要在树中拖放,而不是在树木之间拖放。请指导我如何在树木之间拖延拖放。

        $("#tree1")
        .dynatree(
                {
                    onActivate : function(node) {
                        alert("You activated " + node.data.title);
                    },
                    persist : true,
                    dnd : {
                        onDragStart : function(node) {
                            logMsg("tree.onDragStart(%o)", node);
                            return true;
                        },
                        onDragStop : function(node) { 
                            logMsg("tree.onDragStop(%o)", node);
                        },
                        autoExpandMS : 1000,
                        preventVoidMoves : true,

                        onDragEnter : function(node, sourceNode) {

                            logMsg("tree.onDragEnter(%o, %o)", node,
                                    sourceNode);
                            return true;
                        },
                        onDragOver : function(node, sourceNode, hitMode) {

                            logMsg("tree.onDragOver(%o, %o, %o)", node,
                                    sourceNode, hitMode);

                            if (node.isDescendantOf(sourceNode)) {
                                return false;
                            }

                            if (!node.data.isFolder && hitMode === "over") {
                                return "after";
                            }
                        },
                        onDrop : function(node, sourceNode, hitMode, ui,
                                draggable) {

                            logMsg("tree.onDrop(%o, %o, %s)", node,
                                    sourceNode, hitMode);
                            sourceNode.move(node, hitMode);

                        },
                        onDragLeave : function(node, sourceNode) {

                            logMsg("tree.onDragLeave(%o, %o)", node,
                                    sourceNode);
                        }
                    },
                    children : [ 

                    {
                        title : "Public",
                        isFolder : true,
                        children : [ {
                            "title" : "Item 1"
                        }, {
                            "title" : "Folder 2",
                            "isFolder" : true,
                            "key" : "folder2",
                            "children" : [ {
                                "title" : "Sub-item 2.1",
                                "isFolder" : false
                            }, {
                                "title" : "Sub-item 2.2"
                            } ]
                        }, {
                            "title" : "Folder 3",
                            "isFolder" : true,
                            "key" : "folder3",
                            "children" : [ {
                                "title" : "Sub-item 3.1",
                                "isFolder" : false
                            }, {
                                "title" : "Sub-item 3.2",
                                "isFolder" : false
                            } ]
                        }, {
                            "title" : "Item 5"
                        } ]
                    } ]

                });

,Tree2是

        $("#tree2")
        .dynatree(
                {
                    onActivate : function(node) {
                        alert("You activated " + node.data.title);
                    },
                    persist : true,
                    dnd : {
                        onDragStart : function(node) {
                            logMsg("tree.onDragStart(%o)", node);
                            return true;
                        },
                        onDragStop : function(node) { 
                            logMsg("tree.onDragStop(%o)", node);
                        },
                        autoExpandMS : 1000,
                        preventVoidMoves : true,

                        onDragEnter : function(node, sourceNode) {

                            logMsg("tree.onDragEnter(%o, %o)", node,
                                    sourceNode);
                            return true;
                        },
                        onDragOver : function(node, sourceNode, hitMode) {

                            logMsg("tree.onDragOver(%o, %o, %o)", node,
                                    sourceNode, hitMode);

                            if (node.isDescendantOf(sourceNode)) {
                                return false;
                            }

                            if (!node.data.isFolder && hitMode === "over") {
                                return "after";
                            }
                        },
                        onDrop : function(node, sourceNode, hitMode, ui,
                                draggable) {

                            logMsg("tree.onDrop(%o, %o, %s)", node,
                                    sourceNode, hitMode);
                            sourceNode.move(node, hitMode);

                        },
                        onDragLeave : function(node, sourceNode) {

                            logMsg("tree.onDragLeave(%o, %o)", node,
                                    sourceNode);
                        }
                    },
                    children : [ 

                    {
                        title : "Public",
                        isFolder : true,
                        children : [ {
                            "title" : "Item 1"
                        }, {
                            "title" : "Folder 2",
                            "isFolder" : true,
                            "key" : "folder2",
                            "children" : [ {
                                "title" : "Sub-item 2.1",
                                "isFolder" : false
                            }, {
                                "title" : "Sub-item 2.2"
                            } ]
                        }, {
                            "title" : "Folder 3",
                            "isFolder" : true,
                            "key" : "folder3",
                            "children" : [ {
                                "title" : "Sub-item 3.1",
                                "isFolder" : false
                            }, {
                                "title" : "Sub-item 3.2",
                                "isFolder" : false
                            } ]
                        }, {
                            "title" : "Item 5"
                        } ]
                    } ]

                });

请指导我如何实现Tree1节点可以在我身上DnD Tree1和Trre2节点可以在Tree2中与DnD一起使用。 并限制不应在Tree2中删除Tree1节点,反之亦然。

1 个答案:

答案 0 :(得分:0)

您应该使用:

onDragEnter: function (targetNode, sourceNode) {
    // Prevent dropping a node from a foreign tree
    if (targetNode.tree !== sourceNode.tree) {
        return false;
    }
    return true;
}

它检查要移动的节点的树(sourceNode)是否与要移动的节点的树(targetNode)是同一棵树。如果两棵树不一样,它就会阻止掉落。