Craig
Craig

Reputation: 41

dijit.Tree DnD from tree to tree - child nodes don't get created in target tree

I have two dijit.Trees: srcTree and trgTree. I have implemented the trgTree.itemCreator function and the node that gets dropped is properly created in the target node/tree, but the child nodes of the dropped node are not created. I have tried many permutations to create those as well, but nothing seems to work.

Any insights into what I am missing. Here is my itemCreator code:

    trgTreeItemCreator: function(/*DomNode[]*/ nodes, target, /*dojo.dnd.Source*/ source) {
    console.info("*** start newTreeItemCreator");
    var tmp = dijit.getEnclosingWidget(nodes[0]);

    var kids = dojo.map(tmp.item.items, function(kid){
        return {
            "id": kid.id,
            "name": [kid.name[0]],
            "type": [kid.type[0]]
        };
    });

    var newItems = [{id:nodes[0].id, name:[tmp.label], type:[tmp.item.type[0]], items:kids}];
    return newItems;
},

Upvotes: 2

Views: 2344

Answers (1)

Craig
Craig

Reputation: 41

My post earned a tumbleweed... awesome! :) I figured out a workaround, and here it is.

    var that = this;
    this.trgTree = 
        new dijit.Tree({
            model: this.trgTreeModel,
            dndController: "dijit.tree.dndSource",
            checkAcceptance: this.treeCheckAcceptance,
            checkItemAcceptance: this.trgTreeCheckItemAcceptance,
            getIconClass: app.getIcon,
            onDndDrop: function(source, nodes, copy) {
            that.handleDrop(that, dijit.getEnclosingWidget(
                nodes[0]).item, this.current.item);
            that.srcStore.save();
            that.trgStore.save();
        }
    }, "trgTree");

    handleDrop: function(inPage, inSrcItem, inTrgItem) {
        console.info("*** start addItem: srcItem: " + inSrcItem.name[0]);
        var srcType = inSrcItem.type[0];
        var kids = inSrcItem.items;

        if (inTrgItem.type != "fooType") {
            // do something unique for fooType node targets
        }

    // add the item to the tree
    inPage.addItem(inPage, inSrcItem, inTrgItem);
}

addItem: function(inPage, inSrcItem, inTrgItem) {
    var srcType = inSrcItem.type[0];
    var trgType = inTrgItem.type[0];

    var theName = inSrcItem.name[0];

    if (srcType == "fooType") {
        srcType = inSrcItem.txType[0];
    }

    var newItem = {
        id: inSrcItem.id[0],
        name: theName,
        type: srcType,
        items: []
    };


    newItem = inPage.trgStore.newItem(newItem);
    inPage.trgTreeModel.pasteItem(newItem, null, inTrgItem, false, 0);

    var kids = inSrcItem.items;
    if (kids !== undefined) {
        // call recursively to add child items
        for (var i in kids) {
            inPage.addItem(inPage, kids[i], newItem);
            // TODO: expand the node after it is added
        }
    }
},

All of this code is with the context of being inside of a single class where this is that class (this is a WaveMaker project, and so the class is a wm.Page). Sorry for the lack of details and docs on this, but it's good starter code. If you have specific questions about my workaround, just ask and I will attempt to be timely with an answer.

Upvotes: 2

Related Questions