tree grid + moveNodes() -> r is undefined

[Autoflow]

Using tree grid i set dropModel like this:

Code: [Select]

dropModel.drop = function(evt, ui) {
                var tree = this.Tree();
                tree.moveNodes(ui.helper.data('Drag').getUI().nodes, ui.rowData);
            };
which results in this error when i rearange nodes:

TypeError: r is undefined pqgrid.min.js:16:12837
    moveNodes http://localhost/debian/public/js/pqgrid/pqgrid.min.js:16
    drop http://localhost/debian/public/js/autoflow/phpxpress/widgets/grid.js:2077  --> see dropModel.drop() above
    callFn http://localhost/debian/public/js/pqgrid/pqgrid.min.js:15
    onDropX http://localhost/debian/public/js/pqgrid/pqgrid.min.js:15
    onDrop http://localhost/debian/public/js/pqgrid/pqgrid.min.js:15
    onDrop self-hosted:1005

Can you tell me more about "r"?

[paramvir]

r is a minified private variable name in treegrid, you need not be concerned about its details.

Please check the correctness of parameters passed to tree.moveNodes( nodes: any[], parent: any, indx?: number ) method.

Specifically check the ui.rowData, it should be a parent node.

[Autoflow]

As i see tree grid doesn't support multiple root nodes.
r is undefined is thrown when i try to move a root node below another parent.

https://jsfiddle.net/v17zw2np/

Example:
Moving file "H" below folder "Autoflow".

Are there any plans to support multiple root nodes?

Then i faced another issue:

I need tree grid for building a folder structure based on flat format. So every node is a folder.
When i load data (in jsfiddle above) all nodes without children are files and don't accept other nodes as children.
i.E. moving "Dashboard" below "Server" doesn't work.

Whats the easiest way for flat format to define every node (even them without children) as a folder?
In nested format i could add children:[] to every node, but i don't know how to accomplish this in flat model.

[paramvir]

Good questions indeed and thanks for sharing jsfiddle.

1. Multiple root nodes are supported with DnD however root nodes have to be kept fixed ( non draggable ). Please read the next post for more details.

2. Parent node without children can be defined in flat data by adding pq_close property. It's mentioned in the API:

https://paramquery.com/pro/api#method-Tree

[paramvir]

On further analysis it's found that it makes better sense to keep the root nodes fixed in DnD.

Problem with draggable root nodes in DnD:

Some of the DnD operations become irreversible.
Example: "H" ( root node ) is dropped to another root node "Autoflow", then "H" can't be restored back to its original location.

There are 2 solutions:

1. Add a single fixed root node and make all the nodes from "A" to "H" as children of that single fixed root node.

https://jsfiddle.net/rbncxp9m/

or

2. Keep the nodes "A" to "H" as fixed root nodes.

It's analogous to file system where the drives ( consider them as root nodes ) are fixed and folders and files can be dragged and dropped around.


PS: Add padding:0;margin:0 to body for correct alignment and functioning of DnD.

[Autoflow]

A common root was one idea i came across too.

Unfortunately in my system a common root node is hard to communicate to clients.
Therefore i will prefer fixed root nodes in a first try.

Here another fiddle with rollback support activated but not working yet when resetting moved nodes.

https://jsfiddle.net/L8kne6z7/

Is this functionality basically implemented in 6.2.4?

[paramvir]

Rollback / undo is not supported by Tree.moveNodes() method and there is no immediate plan to add it.

https://paramquery.com/pro/api#method-moveNodes

By reversible ( not to be confused with undo ) in my previous post, I mean that any draggable node can be restored back to its original location by DnD gestures in one or more steps when root nodes are fixed.

e.g., in your recent fiddle, if "H" is made a child of "Autoflow", then it can be restored back by dropping "H" on "Root".