p-tree: how to reorder sibling nodes

[paulharv66]

I have this tree...

Code: Select all

> rootNode
    > node1  <-- drag this node from here...
    > node2
          .....      <-- to here        
    > node3 

This was working fine using primeng 9, but now I've upgraded to version 11.4.2 it no longer works.

• When I drag between node2 and node3 a red bar appears

• In my handler for onNodeDrop, dropNode references node3 NOT rootNode

• In my handler for onNodeDrop, event.dropIndex no longer exists, and event.index doesn't help me distinguish a reorder from a "move into"

I have the following properties set on the tree...

Code: Select all

            [draggableNodes]="true"
            [droppableNodes]="true"
            draggableScope="self"
            droppableScope="self"

Any pointers? Is there a new property I need to set?

Thanks!

[paulharv66]

Answering my own question in case this helps someone else...

I reimplemented my method which determines whether the drop event is a reordering of sibling nodes or a move into another node...
It used to be...

Code: Select all

private isReordering(event) {
        return event.dropIndex != null;
}

...now it's this...

Code: Select all

private isReordering(event) {
        var targetNodeClassName = event.originalEvent.target.className;
        return targetNodeClassName.match(/p-treenode-droppoint-active/); // primeng applies this class to the <li> representing the drop zone between two sibling nodes
}

...horribly brittle, but it works for now...

As far as the red line, that was simply the styling for the theme, so I overrode that in my scss file.