The jQuery UI sortable widget offers a great interface for listing and moving element around.
I have been working on a small project of mine and figured that the sortable widget could be a great feature. I then started to output the list and the element that should be draggable like this:
My HTML list
<ul id="sort1">
<li>
<div>box no 1</div>
</li>
<li>
<div>box no 2</div>
</li>
<li>
<div>box no 3</div>
</li>
</ul>
My jQuery code to enable the sortable widget and for getting a serialized result when an element has been dragged around:
$(document).ready(function() {
$("#sort1").sortable({
opacity: 0.6,
update: function(event, ui) {…
read on