0

これが私が必要とするものです：ソート可能ないくつかのjqueryウィジェットといくつかのドロップ可能なjqueryウィジェットの間で要素をドラッグアンドドロップできるようにするため。

すでに実装されていて動作するもの: 要素をドロップ可能間および同じドロップ可能内にドラッグ アンド ドロップします。

<ul class="sortable" style="background-color:#eeeeee;height:200px">
    <li class="ui-state-default">Item 1</li>
    <li class="ui-state-default">Item 2</li>
    <li class="ui-state-default">Item 3</li>
</ul>

<ul class="droppable" style="background-color:#eeeeee;height:150px">
   <li class="draggable ui-state-default">Drag me down1</li>
   <li class="draggable ui-state-default">Drag me down2</li>

</ul>

<ul class="droppable" style="background-color:#eeeeee;height:150px">
   <li class="draggable ui-state-default">Drag me down3</li>
</ul>

完全なjsfiddle の例をここで参照してください。

備考 ：

ここでは、 connectWithオプションを使用して 3 つのsortables を使用することはできません。droppables の要素をソートしないようにするためです。droppables 内では、ユーザーは制約なしで要素を自由に移動できる必要があります (既に実装されています。jsfiddle の例を参照してください)。

ドラッグ可能でソート可能なjquery uiの例も役に立ちません。なぜなら、ドラッグ可能な要素をソートされたリストに移動する方法ではなく、ドラッグアンドドロップしてソート可能なリストに要素のコピーを挿入する方法を示しているからです。ドロップ可能なソートされたリスト要素（私が欲しいもの）。

受け入れられた回答は、機能するソリューションまたは編集された js フィドルの正確な説明です。

4

1 に答える 1

0

draggable内の要素にクラスを追加して、要素sortableをにドラッグできるようにする必要がありdroppableます。

<ul class="sortable" style="background-color:#eeeeee;height:200px">
    <li class="draggable ui-state-default">Item 1</li>
    <li class="draggable ui-state-default">Item 2</li>
    <li class="draggable ui-state-default">Item 3</li>
</ul>

http://jsfiddle.net/uG62q/1/

于 2012-10-27T20:56:02.690 に答える