views:

67

answers:

1

I suspect I'm not looking at this issue in the right way so here goes.

I have essentially a LinkedList of data on a web page (http://en.wikipedia.org/wiki/Linked_list) that I'd like to manipulate using traditional Linked List behavior (i.e. just updating the reference/id of the "next" object) for performance reasons.

Where this gets a bit tricky is I'd ideally like to use Jquery's sortable to do this. Like the user would drag something up/down and I could just do an Ajax call to the server with the id of the object that moved and the new parent id of that object (and then behind the scenes I could figure out how to reconnect things..maybe need more data than that...).

But every example I've seen where sortable is used they were sending the whole re-indexed list to the database to update which seems unnecessary to me. With a linked list to change an element's "index" I only need to make 3 updates which depending on the size of the list could be a big performance savings. Anyone have an example of what I'm trying to do...am I too far in left field?

+1  A: 

I solved this by hooking onto the 'start' and 'update' events on sortable to figure out which item had moved to where, and then only sending that index to the server.

var items;

$('ul#sortable').sortable({
    start: function() {
        items = $('li.item:not(.ui-sortable-placeholder)', this);
    },
    update: function() {
        $('li.item:not(.ui-sortable-placeholder)', this).each(function(i) {
            var order = items.index(this);
            if (order > i + 1 || order < i) {
                // do ajax request here
                console.log('item %d was moved to %d', order, i);
                return false;
            }
        });
    }
});

The result was used to reorder a list stored on the server, which in Python is as simple as

items.insert(index2, items.pop(index1))
sciyoshi