mar10 / fancytree

JavaScript tree view / tree grid plugin with support for keyboard, inline editing, filtering, checkboxes, drag'n'drop, and lazy loading
http://wwwendt.de/tech/fancytree/demo
Other
2.84k stars 602 forks source link

DND save ? #1102

Closed OursEnSki closed 1 year ago

OursEnSki commented 2 years ago

Hello,

How to save Drag And Drop changes after moving?

How to find the new parent_id and order_id to be stored in DB?

Thank you

kevinblo commented 2 years ago

Try this:

            dnd5: {
                dragDrop: function (node, data) {
                       console.table(node);
                       console.table(data);
                }
            }
OursEnSki commented 2 years ago

Hello,

Yes I have access to this info... but following the DND there is the info before the move but not after, the parent_id is the original one, not the new one or undefined... so how do we get the new info to update the trip?

item_id - parent_id - order_id

Thank you

kevinblo commented 2 years ago

You can store the required data in your keys. I save them when building the tree.

OursEnSki commented 2 years ago

Hello,

There must be something I don't understand.

For example if I move "G 7000" from the root into "F 6000"

dragDrop: function(node, data) { console.log(node); console.log(data); (see screenshot)

I have the info back from "F 6000" not from "G 7000" and therefore I can't save the modification of "G 7000" has been moved to "F 6000"...

Too bad I can't find any example on the net of data backup in DB of fancytree modifications ... that would help things a lot :)

Thank you Capture d’écran 2022-05-15 à 10 55 32 Capture d’écran 2022-05-15 à 10 54 33 Capture d’écran 2022-05-15 à 11 02 15

mar10 commented 2 years ago

Maybe you are looking for data.otherNode or data.otherNodeList. See here (and click 'View source code' at the bottom) for an example https://wwwendt.de/tech/fancytree/demo/#sample-ext-dnd5.html

OursEnSki commented 2 years ago

Hello,

Great, thanks, I managed to find the ids to memorize things:

                 console.log(node.data.id); // parent
                 console.log(JSON.stringify(data.otherNodeData.data.id)); // item moved new child

On the other hand, with the example code, it is no longer possible to move a child to put it at the root. The parent id 0 does not seem to be taken into account console.log(node.data.id); // parent An idea ?

I'm having a little trouble understanding how your awesome tools work. But I'll end up doing it :) And thank you again for your support, it makes me happy.

OursEnSki commented 2 years ago

Hello,

Sorry but I can't manage to do this simple thing of registering after a DND of an item its new parent_id...

It is however the basis of being able to find this vital information to memorize the modification.

So with this: console.log(node.data.id); // parent console.log(JSON.stringify(data.otherNodeData.data.id)); // item moved new child

it works well, except when placing the item at the level 0 root which does not seem to accept giving me level 0 ... strange !!!

it's really a shame that it's so complicated when for each step of modifying the Tree we only need some basic data returns: id, parent_id, order, title

why not indicate them at each modification step in order to save time...

your tools are great, but it lacks documentation and a more complete example to make life easier for users, especially when discovering it.

stale[bot] commented 2 years ago

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.