What is Nested Sort?

nested sort npm version

Nested Sort is a JavaScript library which helps you to sort a nested list of items via drag and drop. Unfortunately, it does not support touch screens yet.

How to use it

On the nested list below, try to drag an item (borders of the dragged item will become red) and drop it onto another one (the targeted item borders will become green). Once done, the dropped item would appear before the targeted item and the new structure of the list would be presented to you in the result section.

If you want to drop an item inside another one you'll need to move your cursor, while dragging an item, inside the targeted item. When the cursor is far enough from the left border of the targeted item an empty space would appear inside of it. Now if you drag the item on top of the empty space a rectangle with green borders would appear in the empty space. When this happens you can drop the item.

  1. Topic 1
  2. Topic 2 (this is a custom rendered item)
  3. Topic 3
    1. Topic 3-1
  4. Topic 4

Result

      Once you drag and drop an item, the JSON data representing the new structure of the
      list would appear here.