Grid Reorderer Overview

The Grid Reorderer is a convenience function for applying the Reorder to a grid of items with minimal effort. This page provides technical details of the API. For a simple working example, see Integrating the Reorderer.


var myReorderableGrid = fluid.reorderGrid(container[, options]);



The container is a CSS-based selector, single-element jQuery object, or DOM element that identifies the DOM element that contains the elements to be reorderable. This may be a <div> that encapsulates the reorderable elements, for example.


The options object is an optional collection of key/value pairs that can be used to further configure the Grid 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 Grid 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 Grid Reorderer. Supported selectors are:

General Options

Grid-specific Options


The Grid 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: