jQuery sortable('disable') from start event not entirely working like expected

Question

The below code does not fully disable the sortables on the start event. It will add the classes "ui-sortable-disabled" and "ui-state-disabled" to the sortable elements, but it doesn't disable the functionality - in other words, the sortables look disabled, but they still accept the dragged item and behave like they are enabled.

var assignedSortables;
var startDrag = function(event, ui) { 
    assignedSortables.each(function() {$(this).sortable('disable');});
};

var stopDrag = function(event, ui) { 
    assignedSortables.each(function() {$(this).sortable('enable');});
};

assignedSortables = $(".my-sortable-containers").sortable({
    connectWith: '.my-sortable-containers',
    start: startDrag,
    stop: stopDrag
});

The reason I want to do this is on drag start is because I might need to disable other connected sortables that already contain the item being dragged (I stripped out the logic in order to simplify). Is this a bug or is there a way around it?

Answer 1

Can you Remove the drag handlers in addition to changing the class?

Answer 2

I'm trying to do the same thing, to avoid people making an object in a hierarchy a child of itself. I've tried sortable('destroy') in addition to sortable disable.

Answer 3

I am looking to do exactly that, no luck so far..
Right now I use the receive method that removes the item after being dropped but I would like to disable my connected list on start

Did you figure it out at the end?

Answer 4

I have not checked to see if the jQuery library has "fixed" this since I asked the question, what I did instead was use the mousedown and mouseup events to disable and enable

$(".myDraggableContainer").mousedown(functionToDisableTheCorrectSortables).mouseup(functionToEnableSortables);

Doing it this way does in fact disable the receiving sortables fully