DataTables
Advanced interaction
features for your tables.
Editor
Comprehensive editing
library for DataTables.
Manual
Download
  • Examples
  • Manual
  • Reference
  • Extensions
    • AutoFill
    • Buttons
    • ColReorder
    • Editor
    • FixedColumns
    • FixedHeader
    • KeyTable
    • Responsive
    • RowGroup
    • RowReorder
      • Examples
      • Reference: Options
      • Reference: Events
    • Scroller
    • SearchBuilder
    • SearchPanes
    • StateRestore
    • Select
    • Standalone: DateTime
    • Legacy: ColVis
    • Legacy: TableTools
  • Plug-ins
  • Blog
  • Forums
  • Support
  • FAQs
  • Download
  • Purchase
≡ Show site navigation

RowReorder examples

RowReorder adds the ability for rows in a DataTable to be reordered through user interaction with the table (click and drag / touch and drag). Integration with Editor's multi-row editing feature is also available to update rows immediately.

Initialisation

  • Basic initialisation
  • Ajax data source with objects
  • Restricted column ordering (sorting)
  • Mobile support (Responsive integration)
  • Full row selection
  • Reorder event
  • DataTables Scrolling
  • Defaults
  • Cancelable
  • Changed event

Styling

  • Hamburger icon for reordering
  • Selector cell styling
  • Horizontal snap
  • Bootstrap styling
  • Bootstrap 4 styling
  • Bootstrap 5 styling
  • jQuery UI styling
  • Fomantic-UI (formally Semantic-UI) styling
  • Foundation styling
  • Bulma styling

DataTables

DataTables designed and created by SpryMedia Ltd.
© 2007-2025 MIT licensed. Privacy policy. Supporters.
SpryMedia Ltd is registered in Scotland, company no. SC456502.