1

JS ビンのデモ

仕事:

jQuery UI を使用してイベント スケジューラを作成しています。イベントは特定の長さ (分単位) であり、それぞれの最大長 (分単位) を持つ別の日にドラッグできます。この例では、1 日の最大長は 480 分であり、480 分を超える "イベント" をドロップすることは許可されません。

問題:

「イベント」によって「日」が最大時間長を超える場合 (既にドロップされた要素の合計時間に基づく)、その「日」は無効にする必要があります (この特定のイベントのドロップは許可されません)。

デモからわかるように、各日のイベントの合計時間を把握できます (「利用可能な時間」はドラッグ ストップで更新されます) が、イベントがドラッグされている場合にその日のドロップを無効にする方法がわかりません。 「利用可能な分数」がマイナスになります。

4

2 に答える 2

2

ここで行う最も簡単な方法は、開始時に関数を実行して、部屋が完全に予約されるかどうかを確認することです。ここで提供されたデモを修正しました:修正されたデモ

確かに多少の改良を加えることができますが、基本的には、ドラッグしているイベントの長さを確認し、時間が足りない部屋のソート可能な UL を非表示にします。部屋を無効にすると有効になるのが遅すぎるため、部屋を非表示にしました。また、時間が足りない場合に表示される各部屋 ul の前に、html にスパンを追加しました。これを js で追加するのがおそらく最善ですが、改良のための時間はあまりありません。

それが役立つことを願っています!

于 2010-08-22T08:37:13.767 に答える
2
$( "#daybox" /*or selector for days elements*/ ).bind( "sortreceive", function(event, ui) {

   if(/*percent*/ >= 100)

      $(ui.sender).sortable('cancel');
});

その後、ドロップされた要素はグループに戻ります。

于 2010-09-09T04:46:45.447 に答える