[ACCEPTED]-sort multiple items at once with jquery.ui.sortable-jquery-ui-sortable

Accepted answer
Score: 15

I had a similar requirement, but the solution 8 in the accepted answer has a bug. It says 7 something like "insertBefore of null", because 6 it removes the nodes.

And also i tried jQuery multisortable, it 5 stacks the selected items on top of each 4 other when dragging, which is not what i 3 want.

So I rolled out my own implementation 2 and hope it will save others some time.

Fiddle Link.

Source 1 code:

$( "#sortable" ).sortable({
    // force the cursor position, or the offset might be wrong
    cursorAt: {
        left: 50,
        top: 45
    helper: function (event, item) {
        // make sure at least one item is selected.
        if (!item.hasClass("ui-state-active")) {

        var $helper = $("<li><ul></ul></li>");
        var $selected = item.parent().children(".ui-state-active");
        var $cloned = $selected.clone();

        // hide it, don't remove!

        // save the selected items
        item.data("multi-sortable", $cloned);

        return $helper;

    stop: function (event, ui) {
        // add the cloned ones
        var $cloned = ui.item.data("multi-sortable");

        // append it

        // remove the hidden ones

        // remove self, it's duplicated
Score: 4

There's a jQuery UI plugin for that: https://github.com/shvetsgroup/jquery.multisortable

jsFiddle: http://jsfiddle.net/neochief/KWeMM/



Score: 0

... or just define a 'items' option to your 1 multisortable that way (for example) :

$('table tbody').multisortable({
  items: 'tr'

More Related questions