Jquery Help：ソート可能にドラッグ可能にしてから再びドラッグ可能に戻す

Question

ドラッグリストにconnectToSortableオプションを使用してソート可能なアイテムのプールがあります。今私は、このソートリストからいくつかの項目を削除し、それらをドラッグリストに戻したいと思います。元に戻すのような並べ替え。ユーザが約5項目をソートリストに移動し、4項目のみを望むと判断し、不要な項目をソートリストからドラッグリストにドラッグすることを決定したとする。ソートリストに「削除」リンクを追加することなく、これをどのように達成しますか？どうもありがとう。 詳細については、http://the-stickman.com/web-development/javascript/jquery-dropping-items-from-a-draggable-list-to-a-sortable-list/

Answer 1

jQuery UI exampleのようになります。それは2つの接続されたリストを備え、ユーザーはそれらの間で要素をドラッグすることができます。

あなたのシナリオが例と一致しないと思われます。ドラッグリスト、各LIがドラッグ可能にされたUL、ソート可能な別のULにリンクされているとします（例についてはthis linkを参照してください）。ドラッグリストから何かをドラッグするたびに、ドラッグされた要素のクローンが使用されます。 "out"イベントを使用すると、ソート可能リストの外にアイテムをドラッグしたときに登録することができます。また、 "stop"イベントがトリガされたときにアイテムがまだ外部にある場合は、ソート可能イベントから削除します。ソート可能ウィジェットのui.officeプロパティーを使用すると、ソート可能ウィジェットから項目を実際に削除する前に、その項目がドラッグリストの上にドラッグされたかどうかを判断できます。

これが役に立ちます。

Answer 2

私は最も簡単な解決策は、あなたのドラッグ可能なリストもドロップ可能にし、そのドロップイベントを処理することだと思います。私は#priority_articles_listをソート可能で、li.articleをグラグラブルとして持っています。それらは#articlesの中にあります。ほとんどの場合、ui.draggable.remove();と呼ぶことができます。

$("#articles").droppable({ 
    accept: '#priority_articles_list > li', 

    drop: function(ev, ui) { 
    draggable_id = "#" + ui.draggable.attr("id").replace("priority_", ""); 
    $(draggable_id).removeClass("shouldnt_drag"); 
    ui.draggable.remove(); 
    if ($("#priority_articles_list").children("li").length == 1) { 
     $("#priority_articles p").show(); 
    } 
    } 
});