#3164 closed bug (fixed)

Opened August 02, 2008 01:20AM UTC

Closed September 16, 2008 01:02PM UTC

Last modified February 01, 2010 11:36AM UTC

Sortables do not work on sorted elements that are also resizable

Reported by: mlang74 Owned by: paul
Priority: major Milestone: 1.6rc2
Component: ui.sortable Version: 1.5.2
Keywords: Cc:
Blocked by: Blocking:
Description

A sortable element that also has the resizable capability applied will not sort. I have created a sample file with sortables where the child elements being sorted are resizable. If I disable the line of code with resizing the sortable works. If I enable the resizable call resizing works, but the item will not sort.

The problem occurs if the resizable call is before or after the sortable call.

$(document).ready(function(){

$('.contentArea').resizable({resize:draggableResize, stop:draggableResizeComplete});

$('.contentGroup').sortable({items:'.contentArea', handle:'.moveButton', connectWith:'.contentGroup', opacity:'.5'});

});

related to #1363 (same test file)

Attachments (4)
Change History (4)

Changed August 02, 2008 01:27AM UTC by mlang74 comment:1

Correction: related to #3163

Changed September 13, 2008 03:44AM UTC by mlang74 comment:2

WORK AROUND:

I found that if I destroy the resizable when the cursor hovers over the sortable handles then sortable suddenly works. Then I can recreate the resizable after sorting is stopped. The solution entails binding two event handlers to the moveButton class elements.

I imagine that this is a big performance overhead, but in the attached example with a relatively small DOM it is still very responsive. See attachment Sortables_NestedError_r4.html for workaround details.

It is a little flaky when you hover over a move button but do not begin to drag, because I have the autoHide option set on the resize handles. They disappear when I destroy the resizable, but do not reappear immediatly on mouseleave of the moveButton. If I move the mouse outside the resizable and back in then the resize handles reappear. This is more of an issue with the autoHide option. The jQuery bound mouseout event seems to be firing fine. If I do not use the autoHide option the handles all disappear and reappear as you would expect given this workaround. But without autoHide it is more obvious to the user that the resizable capability is being removed and added back.

It would be great if this compatibility issue between resizable and sortable could be worked out. It would then be a very robust and user friendly solution.

Thanks,

  • Mike

Changed September 16, 2008 01:02PM UTC by paul comment:3

resolution: → fixed
status: new → closed

Fixed in r683.

Changed November 19, 2008 04:36AM UTC by rdworth comment:4

milestone: 1.6 → 1.6rc2