# Selectable & SortableJS

Drag the items with the handle to rearrange.

- Item 1
- Item 2
- Item 3
- Item 4
- Item 5
- Item 6
- Item 7
- Item 8
- Item 9
- Item 10

    const items = document.getElementById('items');

    const SELECTABLE = new Selectable({
        filter: ".item",
        appendTo: items,
        ignore: ".handle" // ignore the handle used for sorting
    });

    /* https://github.com/SortableJS/Sortable */
    const SORTABLE = Sortable.create(items, {
        animation: 200,
        handle: ".handle",
        onUpdate: function (evt) {
            // Selecting will still work, but shift + select will be broken due to the order difference.
            // So update the Selctable instance to reflect the new order.
            SELECTABLE.update();
        }
    });