2011-10-21 14 views
3

ソート可能なアイテムを受け取る必要があるスロット(ソート可能なドラッグ/ドロップターゲット)の固定リストがあります。リストはいくつかのセクションにグループ化されています。それは次のようになります。私が何をしたいのですがどのようなjQuery UIで固定プレースホルダターゲットにソート可能

http://f.cl.ly/items/3F3E183M2T2s2C0s280K/Screen%20shot%202011-10-21%20at%209.29.27%20AM.png

は、スロットに自分自身をドラッグすると対照的に、異なるスロット間でのソート/物語をドラッグすることができるようです。

各カテゴリのスロット数は固定されています(たとえば、オピニオンカテゴリには2つのストーリーしか存在できません)。また、あるカテゴリから別のカテゴリにストーリーをドラッグすることもできます。

私はいくつかの方法を試してみました...単一のソート可能なリストを使用し、複数のリストを使用して、スロットをソートしていますが、ストーリーだけがソートされているように見えます。何も正しく動作しません。

親要素間で子要素をドラッグ&ソートすることはできますか?この場合、ストーリーは子であり、スロットは親である。

また、誰かに別のアプローチの提案がありますか?

アップデート:ここで私がやろうとしているかを示してJSFiddle例だ:http://jsfiddle.net/xzmKZ/6/

ありがとう!

答えて

0

私はそれぞれのカテゴリをそれぞれ独自のulにします。そして、あなたはconnectWithオプションにセレクタを渡す必要があります。ここでは

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

jsFiddle demo次のとおりです。

+0

感謝を。私はそれを試みたが、それはちょうどスロットを別のリストからドラッグすることができます。 2つの主な目的を解決することはできません。スロットをドラッグして各カテゴリのスロット数を固定します。 (たとえば、第3話をオピニオンカテゴリに追加することはできません)。 –

+0

ああ、私の答えはあなたに役に立たない。コードをもっと書く必要があるかもしれないと思います。要素(ドラッグ可能な要素)をドラッグするだけで、スロットをドロップターゲットとして保持することができます。 –