Sortable objects in script.aculo.us
Posted by Tim Riley Fri, 17 Mar 2006 05:18:00 GMT
There are some really good pieces of Rails documentation popping up around the place these days, but as helpful as they are, it doesn’t mean you aren’t ever without enough rope to shoot yourself in the foot.
The sortable_element JavaScript helper makes it really simple to use script.aculo.us’ Sortable object to make lists of items that are sortable using drag and drop. However, despite the presence of the Rails helper method, it still pays to take careful note of the script.aculo.us’ API documentation.
In this case, I was wondering why the callback for my sortable list was not being invoked after a drop was completed. I referred to some examples in the above-mentioned Rails books and I didn’t seem to be doing anything different at all. In the end I discovered that a certain format for the id attributes of your sortable elements is necessary for the list to operate properly and the callback to be invoked:
<ul id="sortable-list">
<li id="item_1">First Item</li>
<li id="item_2">Second Item</li>
</ul>
The id attributes for the list items must contain a string, followed by an underscore, followed by an integer. I had been using an additional underscore in my string, which caused the list to break. This wasn’t mentioned explicitly in any of the books. So, extra research can never hurt you in the end!