Logic Behind Drag And Drop

I am wondering the 'how it works' and 'how it should be designed and implemented' side of the basic drag & drop functionality. I have never yet implemented such functionality.

Solution 1:

I believe jquery gives you a way to grab their order based on id?

The way I've been doing it is every time an action occurs, grab the current order, send it back to my app via ajax. Then my app just parses out the ids from what it was given and updates every item's order value.

Solution 2:

http://jqueryui.com/demos/sortable/

    $("#col1").sortable({
        placeholder: "top",
        forcePlaceholderSize: true,
        revert: true, 
        update: function() { 
                $.ajax({
                     type: "GET",
                     url: "/request.php",
                     data: "data="+$(this).sortable("toArray")+"",
                     success: function(msg){ }
                        });         
             }
    });

toArray is a sequence of your divs ids

Solution 3:

Unless you are doing this for your own education, I would suggest that you use jQueryUI.

It has drag-and-drop functionality, amongst other things, that would probably help you with the nitty-gritty of DaD, leaving you to implement the parts that are specific to your problem.