2

我定义了多个 DropZone,每个 dropZone 至少需要保留一个可拖动对象。

当用户尝试从 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();

知道为什么这不起作用吗?

谢谢,弗朗索瓦

4

0 回答 0