jquery sortable: Как синхронизировать 2 сортируемых списка?

Question

У меня есть 2 сортируемых списка, которые работают отдельно. Я хочу синхронизировать 2 списка - когда перемещается один элемент списка, позиция смежного элемента в другом списке также перемещается. Вы бы порекомендовали мне функцию или метод?

Answer 1

Это действительно плохо хак, но он может дать вам несколько идей, чтобы начать на:

Working Example

$(function() { 
    $('#sortable').sortable({ 
     update: function (event, ui) { 
      var x1 = $('#X1').position().top +140, 
       x2 = $('#X2').position().top +140, 
       x3 = $('#X3').position().top +140; 
      $('#sortable2 li').css({ 
       position:'absolute', 
       width: $('#sortable li').width() 
      }); 
      $('#Y1').animate({ 
       'top': x1 
      }); 
      $('#Y2').animate({ 
       'top': x2 
      }); 
      $('#Y3').animate({ 
       'top': x3 
      }); 
     } 
    }); 

    $("#sortable").disableSelection(); 
}); 

Я говорю, что это очень плохо хак потому, что он очевидно, не очень хорошо масштабируется ...

Возможно, вам понадобится update function и, вероятно, какой-то animation.

Другим вариантом было бы просто скопировать HTML:

Working Example 2

$(function() { 
    $("#sortable").sortable({ 
     update: function (event, ui) { 
      $('#sortable2').html($('#sortable').html()); 
     } 
    }); 
    $("#sortable").disableSelection(); 
}); 

Это будет масштабироваться намного лучше, но это не так красиво.