jquery/jqueryui.com

Closing a bootstrap "collapse" element in the sortable "start" event doesn't resize the list item

Closed this issue · 4 comments

(posting here until the Trac interface is back up (as per #122))

I suspect this is a timing/ordering issue, but not sure if it's jquery-ui that's at fault or not.

If a list-item in a sortable list contains a collapse element that should close (hide) when the list item is moved, we can use the start() event in the sortable. However, although the collapse element does collapse, the list-item doesn't resize accordingly.

Demo of this here:

http://www.bootply.com/kIM75OP9Ok

If you click "Expand" on one of the items, then drag it you will see it collapse but retain its expanded height.

The desired outcome is that the collapse completes fully before movement (or soon after start)

That's because elements become absolutely positioned during sort, which requires the dimensions to be forced to the values prior to sorting. You may want to use a custom helper.

Hmm.. maybe it's the docs that are a little confusing here. The description of the start() event is:

This event is triggered when sorting starts.

Based on your response:

...dimensions to be forced to the values prior to sorting

It's not clear whether start() fires before sorting starts or after sorting starts.

IMO it would make sense for the start() event to fire before sorting starts which would allow any alteration of dimensions to occur before absolute positioning. Ideally though, start() would actually be more like beforeStart() or beforeMove() to be explicit

beforeStart and start are distinct events (and the former doesn't currently exist). This will be addressed in the rewrite though; see http://wiki.jqueryui.com/w/page/12138075/Sortable.

SGTM. Thanks