jQuery UI的可拖動/排序/可棄禁用當達到極限可放開

Question

JS Bin demo

任務下降：

我創建使用jQuery UI的事件調度。事件具有一定的長度（以分鐘爲單位），並且可以拖入不同的日子，每個日子都有自己的最大長度（以分鐘爲單位）。在這個例子中，每一天的最大長度爲480分鐘，沒有480多分鐘的有價值的「事件」應該被允許在下降

問題：

如果「事件」將導致「日」超過其最大時間長度（基於已經放在其上的元素的組合時間），應該禁用「日」（對於該特定事件不允許丟棄）。

正如你可以從demo看到的那樣，我可以計算出每天的事件總時間（「可用分鐘數」是在停止時更新的），但是我不知道如何禁用掉進日期if被拖動的事件會導致「可用分鐘數」變爲負值。

Answer 1

這裏最簡單的做法是在開始時運行一個函數來檢查是否有任何房間會被預訂完畢。我已經修改了您在此處提供的演示：revised demo

它當然可以使用一些優化，但本質上它會檢查您正在拖動的事件的長度，並隱藏可排序的時間不足的任何房間。我隱藏了房間，因爲禁用它們會生效太晚。我還在每個房間之前在html中添加了一個跨度，以便在沒有足夠時間時顯示。可能最好添加這個js，但沒有很多時間來完善。

希望有幫助！

Answer 2

$("#daybox" /*or selector for days elements*/).bind("sortreceive", function(event, ui) { 

    if(/*percent*/ >= 100) 

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

然後，被丟棄的元素返回到該組。