OSS TanbouOn this page
Overview
SortableJS is a JavaScript library for drag-and-drop list reordering in the browser. Without requiring a framework or jQuery, it supports in-list sorting, moves between lists, drag handles, filters, animation, and event callbacks.
Features and best fit
Based on official documentation; not hands-on tested · Content checked:
Key features
Enable reordering on existing DOM lists with a Sortable instance
Apply Sortable.create() or new Sortable() to a target element to reorder its children. The structure is not limited to ul and li; other container and item elements can be used.
Sources: [1]
Control cross-list moves, copies, and acceptance rules with groups
Lists sharing the same group name can exchange items, while pull, put, and clone settings control which lists may send, receive, or copy items.
Sources: [1]
Tune interaction with handles, filters, events, and plugins
Configuration includes drag handles, filtered elements, animation, direction, and events such as onStart and onEnd. AutoScroll is available alongside plugins such as MultiDrag and Swap.
Sources: [1]
Best fit
Fits priority lists, Kanban boards, and reorderable administration interfaces
It works well when users need to change list order directly or move records between columns without tying the interaction to one frontend framework.
Sources: [1]
Before adoption
Verify native drag-and-drop and fallback behavior on target browsers and touch devices
SortableJS is built on native HTML5 drag and drop and also exposes fallback controls such as forceFallback. Mouse and touch behavior should be tested on the actual target devices.
Sources: [1]
Framework integrations and TypeScript definitions may add separate packages
The README points to separate React, Vue, Angular, and other integration projects, and lists TypeScript definitions through @types/sortablejs. Version compatibility should be checked with the selected stack.
Sources: [1]
Official sources
- [1]SortableJS 1.15.7 README(2026-10-05)
- [2]SortableJS 1.15.7 package metadata(2026-10-05)
- [3]SortableJS 1.15.7 release(2026-10-05)
- [4]SortableJS MIT license(2026-10-05)
Supplemental curator note
Its strength is adding list reordering directly to DOM elements without requiring a framework, while using the same configuration model for both in-list and cross-list moves. TypeScript definitions are documented separately through @types/sortablejs, so TypeScript projects should account for that dependency.
Try it in 3 steps
- 1
Install SortableJS 1.15.7 in an isolated directory
Pin the stable release and test drag-and-drop without modifying an existing application.
demo=$(mktemp -d "${TMPDIR:-/tmp}/sortablejs.XXXXXX") && cd "$demo" && npm init -y >/dev/null && npm install --save-exact sortablejs@1.15.7 - 2
Create minimal HTML with a reorderable list
Use the README's basic initialization pattern with a small animation setting and three draggable list items.
printf "%s\n" '<!doctype html>' '<meta charset="utf-8">' '<ul id="items"><li>Item 1</li><li>Item 2</li><li>Item 3</li></ul>' '<script src="./node_modules/sortablejs/Sortable.min.js"></script>' '<script>Sortable.create(document.getElementById("items"), { animation: 150 });</script>' > index.html - 3
Open the HTML in a browser and reorder the items
Open
index.htmlin a browser and confirm Item 1 through Item 3 can be dragged into a new order.index.html
Growth
Growth trends · Last 30 days
31,186 Stars
Trend data is still being collected.
Development activity
Last 90 days · weekly
- Commits (last 30 days)
- 0
- Open PRs
- 41
Development activity is still being collected.
Built with
Categories and tags
Categories
GitHub data
GitHub dataView detailed GitHub data
GitHub Topics
- drag
- sortable
- reordering
- sort
- drag-and-drop
- drag-drop
- ui
- draggable
- droppable
- touch
- Stars
- 31,186
- Forks
- 3,715
- Watchers
- 402
- Open issues
- 486
- Contributors
- 140
- Owner type
- Organization
- Primary language
- JavaScript
- License
- MIT
- Repository last updated
- Mar 24, 2026
Related information
Write a related articleShare a guide or use case for this OSS in Markdown. Articles are published after administrator approval.
Explore next
- Nano ID27,076 Stars
3 shared tag(s) · Same language
generate short URL-safe IDs from cryptographic randomness and tune the alphabet and length for each use case
JavaScript - Select225,907 Stars
3 shared tag(s) · Same language
Turn native selects into searchable, multi-select, AJAX, tagging, and paginated selectors
JavaScript - SweetAlert218,098 Stars
4 shared tag(s) · 1 shared category(s) · Same language
replace alert, confirm, and prompt dialogs with WAI-ARIA-aware popups that resolve through Promises
JavaScript - Tippy.js12,240 Stars
4 shared tag(s) · 1 shared category(s) · Same language
position tooltips, popovers, and dropdowns with Popper and attach them to hover, focus, or click interactions
JavaScript - Bootstrap174,991 Stars
4 shared tag(s) · 1 shared category(s)
Build responsive interfaces from a CSS/Sass grid, utilities, components, and native JavaScript
MDX - Alpine.js31,960 Stars
4 shared tag(s) · 1 shared category(s)
add state, events, and display behavior directly to HTML for small interactive interfaces
HTML
Report incorrect information
Tell us if any listing information is incorrect or outdated.