jquery-ui - jQueryドラッグドロップは、ドラッグされたアイテムが元のコンテナからドラッグ可能な最後のオブジェクトである場合にキャンセルします

Question

複数の DropZone が定義されています。各 dropZone は、少なくとも 1 つのドラッグ可能なオブジェクトを保持する必要があります。

ユーザーが dropZone から最後のアイテムを移動しようとすると、最後のアイテムを移動できないことをユーザーに警告し、移動アクションをキャンセルする必要があります。常に空ですが、受信イベントで ui.render にアクセスできることを読みました。

元のドラッグ可能な親 (元の dropZone) にアクセスし、ドラッグ可能な子の数を計算する必要があります。カウントが 0 になったら、移動アクションをキャンセルして、ドラッグされたブロックが元の位置に戻るようにします。

何かのようなもの：

function SortableReceiveDrag(event, ui) {
    if ($(ui.sender).find("div.dragableBlock").length <= 0) {
        $(ui.sender).sortable('cancel');        
    }
}

そして、私のバインディングは次のとおりです。

var templateContent = $("#templatectn");
contentDropZones = templateContent.find('div.ContentZone.dropZone');
contentDropZones.sortable({
    accept: 'div.dragableBlock',
    connectWith: 'div.ContentZone.dropZone',
    appendTo: "parent",
    axis: false,
    containment: 'document',
    cursor: 'move',
    cursorAt: false,
    dropOnEmpty: true,
    forceHelperSize: true,
    forcePlaceholderSize: true,
    iframeFix: true,
    items: 'div.dragableBlock',
    greedy: true,
    grid: false,
    helper: "clone",
    opacity: 0.45,
    placeholder: 'ui-block-placeholder',
    revert: false,
    scroll: true,
    scrollSensitivity: 20,
    scrollSpeed: 20,
    scope: "default",
    tolerance: "pointer",
    zIndex: 2700,
    start: function (event, ui) { SortableStartDrag(event, ui); },
    stop: function (event, ui) { SortableStopDrag(event, ui); },
    receive: function (event, ui) { SortableReceiveDrag(event, ui); },
    change: SortableChange
});
contentDropZones.disableSelection();

なぜこれがうまくいかないのですか？

ありがとう、フランソワ