The Reorderer

What is the Reoderer?


The Reorderer is a set of JavaScript objects that can be used by developers to create rich, accessible user interfaces that allow users to directly move around and re-arrange content on the page.

The Reorderer supports mouse-based drag and drop as well as fully keyboard-accessible controls. It is designed to be flexible and will handle a variety of markup and layout types. Clear extension points are provided to customize its behaviour for new layouts, connection strategies, and markup binding strategies.

Examples of the Reorderer

The reorderer is a JavaScript-only component and does not have a user interface. Therefore there are no interaction designs.

API

  • Reorderer API - Including APIs for grid, list, and layout reorderers.

Integration

Demos

Testing

What presentation technologies is supported?

The Reorderer is designed to work across presentation technologies. We've used it in Java RSF and PHP-based applications, but it will work in any technology that can generate known element IDs and can respond to simple POST requests. The contract of the Reorderer is published and easy to implement.

What can I Reorder?

Well, in theory, anything. The Reorderer will work with all kinds of markup you throw at it. Reorder schedules, tasks, lists, whatever you like. There are a few limitations in the current version of the Reorderer that we'll address in future releases. These include:

Roadmap, Known issues, and Task List

The upcoming road map for the Reorderer is as follows:

For more specific details about Reorderer-related tasks and issues, please see the Reorderer component with Fluid's issue repository.

Working Pages