jquery - jQuery ドラッグ アンド ドロップ - 項目の位置を変更する

Question

だから、ここに私のジレンマがあります。6 つのドラッグ アンド ドロップ項目があります (下図)。彼らはうまく機能します。アイテムを別のドロップアイテムにドラッグすると、ご覧のように重なってしまうという事実を除いて. 私が疑問に思っているのは、他のアイテムを移動させずに DIV を挿入する方法はありますか?

before() および after() 関数を使用してみましたが、他のすべての要素が押し下げられ、複数のドラッグ項目がドロップされている場合は機能しません。したがって、私が望んでいるのは、他の要素をシフトさせることなく、アイテムを次の利用可能な場所に移動することです。

何か案は？

更新- 基本的に、私がやろうとしているのは、ソート可能な jQuery とドラッグ可能なものを組み合わせることです。それが何かに役立つかどうかはわかりませんが、ドラッグアイテムをソートアイテムが再配置するように反応させたいので、それは本質的に私がやろうとしていることです.

Answer 1

ここで何をしたいのかを正確に完全に理解しているかどうかはわかりませんが (「他のアイテムを動かさずに」とはどういう意味ですか?)、アイデアを正しく理解していれば (ユーザーは黄色を注文することを意図しています)。ボックスをステップ 1 ～ 6 に正しく配置し、各ステップで 1 つのアイテムのみを使用する場合)、おそらくドラッグ可能ではなく、jQuery UI の並べ替え可能なウィジェットを使用する必要があります。これにより、アイテムが重複することなく単純なリストにきちんと並んでいるように自動的に処理され、フォームから送信されたリストの順序から、どのステップがどのステップであるかを簡単に取得できます。