使用jQuery UI對固定佔位目標進行排序可排序

我有一個需要接收可排序項目的插槽（可排序拖放目標）的固定列表。該列表分爲幾個部分。它看起來像這樣：使用jQuery UI對固定佔位目標進行排序可排序

我希望做的是能夠跨越不同的插槽拖動/排序的故事，而不是拖動插槽自己。

每個類別的插槽數量是固定的（例如，意見類別中只能有2個故事）。故事可以從一個類別拖到另一個類別。

我試過幾種方法...使用單個可排序列表，使用多個列表，排序插槽，但使它看起來像只有故事正在排序。沒有什麼正確的。

是否可以通過父元素對子元素進行拖拽和排序？在這種情況下，故事是孩子，而老虎機是父母。

還是有人有另一種方法的建議嗎？

更新：這裏有一個例子的jsfiddle顯示我想要做的事：http://jsfiddle.net/xzmKZ/6/

謝謝！

我會使每個類別他們自己的ul。那麼你應該選擇傳遞到connectWith選項：

$(function() { 
    $("#sortable1, #sortable2").sortable({ 
     connectWith: ".connectedSortable" 
    }).disableSelection(); 
});

這裏是一個jsFiddle demo：

2011-10-21 14:05:40

感謝。我已經嘗試過，但只是允許將插槽從一個列表拖到另一個列表。它沒有解決2個主要目標：拖拽故事（不是插槽），並且固定每個類別的插槽數量。（例如，第三層故事不能添加到意見類別中）。 –

啊，那麼我的回答對你沒有任何幫助。我想你可能需要編寫更多的代碼，我會考慮使用可拖動和可拖動的交互。他們應該允許你保持插槽（作爲放置目標），而只需拖動元素（可拖動）。 –

回答