問題タブ [mootools-sortable]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票する
1 に答える
748 参照

jquery - mootoolssortablesとjquerysortablesの効果

私はしばらくの間mootoolsを使用していて、jQueryを1週間試しているので、これはおそらく初心者の質問です-マニュアルには何も見つかりませんでした。

mootoolsでは、並べ替え可能なリストでオプションcloneを使用すると、画像/オブジェクトのクローンが作成され、画像/オブジェクトがドロップされる場所を視覚化できます。これは、サムネイルの並べ替えシステムでうまく機能します。

mootoolssortablesのドキュメントページ

ええと、jQueryにも同じオプションであるcloneがありますが、私が使用しても何も起こりません。つまり、実際には要素のクローンを作成し、ドラッグしたものはクローンですが、ドロップすると、元の要素は以前の場所に正確に残ります。この動作は、サイトにあるドラッグ可能なデモで確認できます。半透明のクローンを見てください。移動することができ、ドロップしてもそこにとどまります。

これはバグのある動作ですか、それともどうあるべきですか?私は自分でmootoolsの振る舞いを複製することができましたが、これは標準的なオプションですが...

前もって感謝します!

0 投票する
1 に答える
1086 参照

serialization - DOM / mootools sortables のループ

ソート可能なリストのハンドルを取得できないようです。それらはリスト要素のリストであり、それぞれに

そこから値を取得する必要があります。

sortables リストは、ループ内のリストに追加されますsort.addItems(li);。しかし、sortables onComplete 宣言の外で sortables を取得しようとすると、js は this.list が未定義であると言います。


別の角度から問題にアプローチする:

DOM をループしようとすると、同様に奇妙な結果が得られます。いくつかのコードの firebug コンソールの結果は次のとおりです。

HTML に 1 つの li 要素を (JS を介して注入されるのではなく) ハードコーディングすると、長さ == 1 が変更され、その単一の要素にアクセスできるようになり、DOM を介して注入された要素にアクセスすることが問題であると信じるようになります (この方法の場合)。

火虫

document.getElementById('teams').childNodes[i]戻り値が未定義のオブジェクトを取得しようとしています。

助けてくれてありがとう!

0 投票する
1 に答える
166 参照

javascript - mootools ソート可能デタッチ

私は Mootools 1.3 を使用してインターフェイスに取り組んでいます。このインターフェイスには、左側に「使用可能な要素」、右側に「選択された要素」という 2 つの列があります。avail のリストから取得します。左に、右に引くと並べ替えができます。

ここにフィドルがあります:http://jsfiddle.net/Um3xK/1/

私が望むのは、左側の列から「並べ替え」を切り離すことです。これは必要がなく、混乱を招く可能性があるためですが、右側の並べ替えはそのままにして、右側の列から「左にドラッグ」を切り離すこともできます。アイテムを右から左に引っ張る必要はなく、左から右に引っ張るだけです。

これは可能ですか?Mootools のドキュメントを読むと、「デタッチ」メソッドを使用すると、すべてのクリック/ドラッグ イベントがデタッチされるようです。

0 投票する
1 に答える
104 参照

javascript - MooToolsのSortableプラグインを使用してドラッグするDOM要素のすべての子を含めるにはどうすればよいですか?

私は使用してmootools-more.1817.jsいます...これは私のHTML構造です:

だから私は2つのことをしたい:

  1. liアイテムを別のセクションにドラッグして、すべての子を連れて行くことができます。たとえば、リンクのあるliをドラッグしている場合、単語だけでなく、その親の子である、もTop Linksドラッグしたいと思います。基本的に、それぞれのすべての子。Top Linksdiv#adminullilili
  2. また、子のリスト間でアイテムをドラッグできるようにしたいと思います。たとえば、リンクLink 2をそこからul呼び出されたセクションにドラッグし、リンクとAwesome Linksの間にドロップしたいとします。Link 11Link 12

私はこれをしました:

liそれが行うのは、の子ではなく、だけをドラッグすることliです。

どうすればそれらを達成できますか?

ありがとう。

0 投票する
1 に答える
223 参照

javascript - Mootools Sortable -- 上下に移動

Mootools sortables (v1.4) を使用しています。

アイテムのリストがあり、並べ替えはドラッグ/ドロップ操作でうまく機能します。ただし、各リスト項目に「上/下」矢印も追加して、ユーザーが必要に応じて「スロット」を 1 つ上または下に項目をクリックできるようにしたいと考えています。

これを達成する方法について、ドキュメントには何も見当たりませんでした。これを行う方法はありますか?

ありがとう!

0 投票する
1 に答える
480 参照

javascript - mootools sortable から要素を削除する

mootools の並べ替え可能なリストから項目を削除してから、新しいリストをシリアル化して保存しようとしています。

destroy()要素をまっすぐにするのではなく、少し目を楽しませたいと思います。ここにフィドルを作成しました:http://jsfiddle.net/kBAqJ/4/

order1およびorder2varsに注意してください。これは、アイテムを削除する前後のシリアル化された要素を保持します。destroyソート可能から要素を削除した後にメソッドを使用して要素を削除するとorder2、たとえば の正しい値が得られます。4.

nix(true)の代わりに使用すると、 anddestroyの値として 5 が得られますが、ドキュメントではafterを呼び出すと書かれています。order1order2nix(true)destroydissolve

これは Mootools のバグですか、それとも何か不足していますか? 適切な結果が得られるように、dissolve使用中にエフェクトを追加する別の方法はありますか?destroy

0 投票する
1 に答える
143 参照

php - ロードされた順序で値のリストをソートするにはどうすればよいですか?

アプリケーション1 から n までの項目 のリストがあり、ユーザーにそれらを n から 1 までランク付けしてもらいたいとします。各項目には期日があります。アイテム 1 の期日が最も近く、アイテム n が最も遅い期日です。アイテムの期限が切れる前に、ユーザーが希望するランク順でアイテムをランク付け/ソートするようにします。期日が過ぎたアイテムをユーザーがランク付け/並べ替えできないようにしたいが、並べ替えられたランクですべてのアイテムを表示したい。

期限切れのアイテムから期限切れのアイテムを分離するには、それらを 2 つの別個のテーブルにロードします。

--期限テーブル: 上部のテーブルには、ユーザーが並べ替えてランク付けできる期限アイテムのみが保持されます。順位は降順で読み込まれます。(ランク順は、以下の jsFiddle の例で目に見える数字です)

--期限切れのアイテム テーブル: 下部のテーブルには、ユーザーが並べ替えることができなくなった期限切れのアイテムが表示されます。アイテムが期日を過ぎてこのテーブルに入ると、以前に保存されたランクが保持されます。注文はアイテム順でカウントアップされます。期日順の昇順と同じです。

ユーザーにランク付けしてもらいたい 10 個の項目のリストがあるとします。アイテムが期日を過ぎる前に、次のように期日表のみが表示されます。 . 画面に表示される数字は降順の順位です。

予定表の項目のランクは常に降順であるため、ユーザーは項目の信頼度を高くしたり低くしたりできます。ランク数は常にアイテム数と一致しますが、最初は逆になります。たとえば、アイテム 1 はランク ポジション 10 (一番上) から始まり、アイテム 10 はランク ポジション 1 (一番下) になります。

アイテムが期日を過ぎると、下のテーブルにそれらの期日を過ぎたアイテムが表示され、保持されます。ユーザーがアイテムを並べ替えて保存し、半分が期日を過ぎたとします。次のようにテーブルが表示される場合がありますhttp://jsfiddle.net/jpl1618/Y4tjJ/一番下のテーブルには、項目 1 から 5 がこの順序で保持されていることに注意してください。これは、一番下の表では、期限の昇順と同じアイテム順の昇順で並べられているためです。また、ユーザーがアイテム 4 と 5 をランク位置 10 と 6 に並べ替えたことにも注意してください。これらのランク位置は、アイテムの期限テーブルを再ランク付けするときに使用できなくなります。

期限切れのアイテムの例ここに jsfiddle.net/jpl1618/Y4tjJ/ アイテム 8 (位置 5) を位置 7 に移動し、アイテム 10 (位置 7) を位置 5 に移動できるはずです。結果があります:

または、項目 8 を位置 9 の一番上まで移動できるはずです。これにより、項目 9、6、10 が 1 つ下に移動します。次に、次のようになります。

アイテムの順序に関係なく、ランク順は同じ降順のままであることに注意してください。

質問現在の JS コードをどのように変更して、ロードされた順位を降順で保持する期日表の項目をランク付け/ソートできるようにするにはどうすればよいですか? 例では、ランク順は常に 9、8、7、5、4 を表示する必要がありますが、アイテムはそれらの位置に移動できます。

もう 1 つの小さな問題: クリックして並べ替えると、表の行の色が変わるのはなぜですか? 行をクリックしたときに行が他の色に点滅しないようにするにはどうすればよいですか?

0 投票する
1 に答える
297 参照

mootools - ドラッグ + ドロップ可能イベントの後、Mootools の削除イベントが機能しない

ここでいくつか修正する必要があります。

  1. ドロップ イベントの後、削除ボタンは機能しません。削除は、ドロップゾーンにないアイテムに対してのみ機能します。ここで何が問題なのかわかりません。また、ドロップされたアイテムを複製するのではなく、ドロップされた各アイテムに削除ボタンを追加することをお勧めします。

  2. ドロップされたアイテムを並べ替えることができる必要があります。sortable は、以下の現在のデモには含まれていません。

HTML:

DomReady イベントは次のとおりです。

現在の Jsfiddle コードのデモ

助けてください...

0 投票する
1 に答える
221 参照

mootools - Mootools のドラッグ アンド ドロップとドロップ後の並べ替えの作業。入力順序を追跡するには、並べ替え後に ID を置き換える必要があります

説明: フォーム要素をドラッグ アンド ドロップして、後で表示されるフォームを作成します。

必要: - 入力およびテキストエリアのフォームフィールドは、並べ替え後に ID を順番に並べる必要があります。質問への回答と指示を参照する必要があります。現在、並べ替えられていると、後でレコードを表示するときにそれらをどの順序で表示するかわかりません。より良い方法があるかもしれませんが、私は今立ち往生しています。

  • 並べ替えの問題: 並べ替え可能な領域は、ドラッグ ドロップ イベントの後まで機能しません。すぐにソートする必要があるデフォルトのフィールドがあります。

これがフィドルです:http://jsfiddle.net/htscraig/vhkGD/3/