The final interaction helper that we're going to look at is the sortables component. This component allows us to define one or more list of elements (not necessarily actual <ul>
or <ol>
elements), where the individual items in the list(s) can be reordered by dragging. The sortables component is like a specialized implementation of drag-and-drop, with a very specific role. It has an extensive API, which caters for a wide range of behaviors.
A basic sortable list can be enabled with no additional configuration. Let's do this first, so that you can get an idea of the behavior enabled by this component. In a new file in your text editor, add the following code:
<!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <title>Sortable</title> <link rel="stylesheet" href="development-bundle/themes/redmond/jquery.ui.all.css"> <script src="js/jquery-2.0.3.js"></script> <script...