問題タブ [jquery-ui-draggable]

次のオプションでドラッグ可能を使用しています。

ロード時にjqueryUIタブの2番目のタブのコンテンツにドラッグ可能を適用しています：

問題は、最初のドラッグだけが正常に機能することです。ドラッグ可能なものを許容可能なドロップ可能なものにドロップしないと、ポッドは元に戻りますが、別のドラッグを行うことはできません。何があっても、ドラッグされたポッドはドラッグ可能性を失います。

ドラッグ可能なinitに停止関数を適用しようとすると、無限の.draggable呼び出しをネストする必要があるという道に私を置きました。

完全なスクリプト：

このフィドルは機能するので：http：//jsfiddle.net/notbrain/DycY6/41/タブがロードされたときの.draggable（）の動的アプリケーションに関連していると確信しています。

どんなポインタでも大歓迎です！

jQuery Draggable オブジェクトがある場合

および接続されたソート可能

このドラッグ可能なものが空のソート可能にドロップするのを防ぐことはできません。

Sortable自体にはオプション dropOnEmpty があり、false に設定すると、その sortable から空の sortable にアイテムをドロップできなくなります。しかし Draggable にはそのようなオプションがありません。

私はこれを試しました：

私の場合、#drag-me 要素は画像ですが、Sortable 要素はそうではありません。performMagic 関数は、画像をソータブルが構成する TBODY 要素に正常に変換しています。しかし、結果には一貫性がありませんでした。操作を正常にキャンセルできる場合もあれば、他の場所で中断する場合もあります。

問題は、私は正しい軌道に乗っているかということです。Draggable が空のリンクされた Sortable にドロップされないようにする唯一の方法はありますか? 既存の Sortable-to-Sortable 動作を乗っ取る方法はありますか?

ティア・アル

編集：私はこの質問を切り詰めて、それを置きました

変更されるのは元のアイテムであり、新しいアイテムではないことを確認してください http://jsfiddle.net/mikkelbreum/DBG5q

ドラッグされたヘルパーがどのように変更されるかを確認しますが、要素がドロップされると元に戻ります。 http://jsfiddle.net/mikkelbreum/dpTC8

並べ替え可能なリストにリンクされたドラッグ可能なリストがあります

ドラッグ可能から並べ替え可能にドラッグするときは、複製されたヘルパーを使用するため、元のヘルパーは引き続きドラッグ可能コレクションに残ります。

クローンをドラッグ可能なリストからソート可能なリストにドラッグするたびに、新しいコピーに一意の見出しを付けたいと思います（h2要素を操作します）。

新しく作成された要素に対処する方法が見つかりません。

私は2つのアプローチを試しました：

1つは、ドラッグ可能なオブジェクトの開始イベントでヘルパークローンをターゲットにすることです。ここでの問題は、ヘルパークローンは変更されますが、その変更は、並べ替え可能なリストに作成されたときに最終要素にコピーされないことです。そこで作成された新しい要素は、それがクローンであるドラッグ可能なリスト内の元の値を取ります。

ドラッグを開始すると、クローンで変更された変更を確認できますが、ソート可能オブジェクトにドロップすると、h2は元の見出しにリセットされます。

そこで、ソート可能な受信イベントで新しいオリジナルを変更しようとする2番目のアプローチを試しました。

これにより、要素をドラッグしたリスト内の元の要素のh2が変更されますが、sortable内に作成された新しい要素は、古い元の要素のままです。

どうすればそれをターゲット/変更できますか？

jQueryUI Dragger を使用して、デフォルトの top プロパティと left プロパティの代わりに、margin-top、margin-left に基づいて項目をドラッグするにはどうすればよいですか。

jQuery UI ライブラリを使用して要素をドラッグおよびソートします: http://jqueryui.com/demos/sortable これは正常に動作しますが、テキストエリアなどの入力要素をドラッグできません。これらのテキストエリアは無効になっているため、書き込む必要はありません。少しググったところ、この問題を抱えているのは私だけではないことに気付きました。これにはいくつかの半解決策がありますが、それらはすべて時代遅れのようです。(jQuery は急速に発展します)。

ulドラッグ可能なアイテム、(#doc-editor-options ul li)それらのアイテムをドロップするための領域、およびそれらのアイテム(#doc-editor-content)をul保持するためのその領域内に、並べ替え可能なアイテム(#items-holder)があります。このドラッグアンドドロップは一方向のみであり、リストのアイテムのみをホルダーにドラッグアンドドロップできます。

私が持っている2つの質問：

1. 現在、リストからアイテムをドラッグして他のリストにドロップすると、のdropコールバック.droppable()が2回呼び出されます。#item-holderこれは、ソート可能であることと関係があると思います。eventアイテムをリストにドロップし、そのアイテムとuiコールバックについてのみ知っている場合にのみ起動されるようにします。
2. items-holderデフォルトでソートできない機能も必要です。並べ替え可能になるのは、アイテムをドラッグしてホバーしているときだけです。そのため、デフォルトではリストを並べ替えることはできませんが、アイテムをリストにドラッグすると、そのアイテムをリスト内のどこに配置するかを選択でき（つまり、リストは並べ替え可能になります）、一度ドロップすると、リストは並べ替えできなくなりますまた。

編集：私は＃2を理解しました、私mousedownはソートを有効にしてからそれを無効にするドラッグ可能なアイテムにバインドする必要がありましたmouseup。＃1でまだ問題が発生しているので、アイテムをアイテムホルダーにドロップしたり、アイテムホルダーからホバーしたりすると、一部のsortableイベントでコールバックが発生しているようです。drop

私はドラッグ可能なものと一緒に並べ替え可能なものを取得しようとしています。いくつかの ebox を並べ替えることができますが、並べ替え要素をそのラッパー要素の外にドラッグするように制限しています。

ここにコード: http://jsfiddle.net/jsMR4/

何が起こるかというと、ソート可能なプラグインが軸をオーバーライドしているように見えます: ドラッグ可能な 'x' オプションと、ラッピング コンテナーの代わりにドキュメント内の任意の場所に任意の要素をドラッグできます。

これらを一緒に機能させ、望ましい動作を達成するために何かを提案していただければ幸いです。

どうもありがとう！

よろしく、 byte_slave

jQueryのドラッグアンドドロップに問題があります。私のコードにはドラッグ可能なdivがあります。ドロップ可能な特定のテーブルセルに移動すると、divのクローンがテーブルセルに追加されます。しかし、クローンをドラッグすると、代わりに元のdivが移動します。これは、ドロップ時に呼び出される関数です。

グーグルで明確な答えを見つけることができませんでした。これと関係があるかどうかはわかりませんが、divは相対的な位置にあります（そしてそのようにとどまる必要があります）。

クローンを元のクローンと同じようにドラッグできるようにするにはどうすればよいですか？

私は、コードのチャンクを必要とする Web サイトに取り組んでいます。その性質は、私の限られた JQuery の知識をはるかに超えていることが証明されています。サイトの構造は次のとおりです (JQuery に関して、サイトで何を行う必要があるかについて、これが最適に構造化されているかどうかはよくわかりません)。

基本的な前提は、"menutype" DIV の 1 つがドロップ可能領域内にドロップされると、対応するメニュー構造がコンテンツ DIV で明らかにされるということです。同様に、ドロップされると、「contenttype」はそのメニュー内のインライン コンテンツを表示します。

この時点で、私はこれを達成する方法について困惑しています。私の主な問題は、.droppable 内でメニューとコンテンツ タイプを区別する方法がわからないことです。ドロップ可能なアイテムを定義する方法しか知らず、ドラッグ可能なアイテムを個別に処理する方法がわからないためです。

誰かが必要なコードを吐き出すとは思っていませんが、いくつかのポインタや例をいただければ幸いです。

jQuery UI Draggable は、grid設定すると、ドラッグ可能な要素をグリッドにスナップするオプションを提供します。これで私が抱えている唯一の問題は、スナップする前にアニメーション化したいということです。

私のグリッドの場合[500,500]、マウスが 500px の距離をカバーするまで、ユーザー フィードバックはありません。

同様の「グリッドへのスナップ」を行うだけでなく、同時にアニメーション化することは可能ですか?