動的な "connectWith"オプションでjQuery UIをソート可能

Question

私は3つのテーブルを持つページを開発しています。 3番目のテーブルには、ソートして1番目または2番目のテーブルにドロップできる行があります。

他の2つのテーブルのいずれかで特定の行を削除できるかどうかを動的に定義する方法はありますか？ 「connectWith」オプション...または他の方法で動かす...

Answer 1

jQuery UIの.draggable()メソッドを使用して、3番目のテーブルの行を定義できます。 ドラッグ可能なメソッドを呼び出すと、要素をドロップできる場所を指定できます。

次にtrのドラッグで、現在のテーブルを現在のテーブル（3番目のテーブル）から隠します。 trを削除したら、trを削除したテーブルを取得し、実際にtrを追加して、実際に3番目のテーブルから行を削除します。 ドラッグイベントがうまくいかない場合（たとえば、間違った場所にドロップした場合など）、行を再度表示できるので、最初は3番目のテーブルからすぐに行を削除しない方がよいでしょう。ここで

のjQuery UIのドラッグ可能な方法へのリンク：コードの

https://jqueryui.com/draggable/

POC：ご返信用

$("#third-table tr").draggable({ 
    snap: ".drop-tables", 
    start: function() { 
     // hide the row from the third table 
    }, 
    stop: function() { 
     // add the row to the target table 
     // remove the row from the third table 
    } 
});