List Reorderer Overview

The List Reorderer allows reordering of elements in a vertical or horizontal list. This page provides technical details of the API. For a simple working example, see Integrating the Reorderer.


var myReorderableList = fluid.reorderList(container[, options]);



The container is a CSS-based selector, single-element jQuery object, or DOM element that identifies the DOM element containing the list items to be reorderable. This may be the list itself (e.g. the <ul> or <ol> element) or an element that contains the list.


The options object is an optional collection of key/value pairs that can be used to further configure the List Reorderer, as described below in the fluid:Options section.

This component is in Production status

Join the infusion-users mailing list and ask your questions there.

Supported Events

The List Reorderer fires the following events (for more information about events, see Events for Component Users):



The selectors option is an object containing CSS-based selectors for various parts of the List Reorderer. Supported selectors are:

General options

List-specific options


The List Reorderer dependencies can be met by including the minified InfusionAll.js file in the header of the HTML file:

<script type="text/javascript" src="InfusionAll.js"></script>

Alternatively, the individual file requirements are: