Drag to change nesting levels

[paulschwarz]

trafficstars

I have an arbitrary tree, think of a menu in a CMS. Each node is a menu item. The nesting can be arbitrarily deep.

I'd like to be be able to drag/drop to sort nodes beneath a parent node. That part seems simple enough to implement.

I also need to be able to "outdent" a child node so it becomes a sibling of the parent.

And I need to be able to "indent" a node beneath some other node, thereby making it a child of that node.

I can set up the markup using either divs nested <ul>s and <li>s.

[lukasoppermann]

This is currently not possible. However I implemented something like this in a different library: https://github.com/lukasoppermann/nestable it is not perfect, but if you want to try port it to this package and send a PR I will be happy to merge it.

Also if you are working on it and run into trouble, I can try to help you.

[paulschwarz]

Thanks. I actually got pretty close. This fiddle seems to address my requirements fairly well. https://jsfiddle.net/qg4qkjux/3/

I'm testing it now to see if I run into any showstoppers. One possible issue would be that I want the top level nodes to remain top level. E.g. a user should not be able to drag "Category Level 1" inside of "Category Level 2".

[lukasoppermann]

Pretty nice. Any nestability would be appreciated as long as it is tested and works in all major browsers (current versions only).

Optimal would be to include tests of course.

[lukasoppermann]

hey @paulschwarz did you get it done? Can you send a PR to add this?