jQuery UI：タブを使用してソート可能なリストを接続する

Question

jQuery UI公式サイトのan exampleは、タブを使用してソート可能なリストを接続する方法を示しています。しかし、私は次のように変更されたバージョンが必要です。ドラッグする要素をタブの上に移動すると、タブが自動的に選択されるので、選択したタブ内の任意の位置に要素をドロップできます。

さまざまな方法で試してみましたが、幸運を得られませんでした。誰にでもいくつかのアイデアがありますか？この1の作業

Answer 1

、スタートを持っていますが、UIの人たちからいくつかの洞察を使用することができ

http://jsfiddle.net/L8QAE/1/

Answer 2

は、この方法を試してください。http://jsfiddle.net/2Xq2x/1/。オリジナルのものをほんの少し修正しました。

$(function() { 
    $("#sortable1, #sortable2").sortable({ 
     connectWith: "#sortable1, #sortable2" 
    }).disableSelection(); 
    var $tabs = $("#tabs").tabs(); 
    var $tab_items = $("ul:first li", $tabs).droppable({ 
     accept: ".connectedSortable li", 
     hoverClass: "ui-state-hover", 
     over: function(event, ui) { 
      var $item = $(this); 
      var $list = $($item.find("a").attr("href")).find(".connectedSortable"); 
      $tabs.tabs("select", $tab_items.index($item)); 
      ui.draggable.appendTo($list).show("slow"); 
     } 
    }); 
});