MooTools 1.3 Cookbook

Creating a sortable list

MooTools has sweet utilities that most have never even realized they needed. Hang on for a recipe that makes you want to shout, "Hey, I didn't know you could do that!".

Getting ready

Be sure to include both the MooTools Core and the MooTools More for this recipe.

How to do it...

Create a list to sort.

<ol id="mylist" style="line-height:25px;cursor:pointer;">
<li>Oldies-but-Goodies: Foundational Moo</li>
<li>Switching Paddles Midstream: Changing HTML After Page Load</li>
...
<li>I'll Gladly Pay Tue. For Moo Today: Extensions on the Web</li>
<li>Electric Milk: Plugins and More</li>
</ol>

Then ask MooTools to make it sortable.

<script type="text/javascript">
var list = new Sortables('mylist');
</script>

Grab, drag, sort, and shout, ...