zoom_in Click to enlarge

SortableJS

▲ ▼

language

description SortableJS Overview

SortableJS is a JavaScript library facilitating drag-and-drop functionality for rearranging list items within web browsers. It offers extensive customization options and operates independently of specific web development frameworks. This makes it suitable for developers building any website requiring interactive list sorting, particularly those needing precise control over the reordering process.

It’s commonly used by front-end developers and designers creating dynamic content displays.

help SortableJS FAQ

Does SortableJS work without requiring external libraries like jQuery?

Yes, SortableJS is a standalone, vanilla JavaScript library that does not require jQuery or any other frameworks to function. This makes it highly efficient and easy to drop into modern web projects without adding bloat.

How do I save the new order of a list after dragging items with SortableJS?

You can capture the new array order by using the `onEnd` event listener within the library's configuration options. This event will pass you an object containing the old and new indices of the dragged item, which you can then use to update your backend database.

Can SortableJS handle dragging elements between two different lists?

Yes, the library supports shared groups, allowing you to seamlessly drag items from one list to another. You configure this by setting the `group` option to the same string identifier on both sortable lists.

Is SortableJS compatible with frontend frameworks like React or Vue?

While the core library is framework-agnostic, the developers maintain official wrapper components for React, Vue, Angular, and others. These wrappers help prevent conflicts between the library's direct DOM manipulation and the framework's virtual DOM.

swap_horiz

Looking for SortableJS alternatives? Compare top competitors ranked & scored

arrow_forward