CODEWITHSUNDEEP
jquerycssjquery-ui
Tim Fletcher
Tim Fletcher

Reputation: 7396

Cannot properly sort dynamically added sortable jQuery UI images

I have an issue with sorting images dynamically added to a container with jQuery UI's sortable() on it. I'm thinking this is somehow a CSS issue because if I have the elements displayed as block, i.e. stacked, it works perfectly:

http://jsfiddle.net/z6ARX/1/

The image are sortable, so I know the JS is working, I just can't drop them properly. I did notice doing the fiddle that clicking moves them around. In my app clicking removes the item from the sortable area so I didn't notice this before. The main problem's still there though.

Now, if I float the images left, when they're added they can't be sorted (I'm using the latest Chrome):

http://jsfiddle.net/QMwfk/1/

Of note, if the images already exist within the sortable div on page load everything's fine:

http://jsfiddle.net/zf9pR/

I'm really stuck on this and would really appreciate any help! I couldn't find any questions that addressed this issue specifically. If you find one please let me know!

Upvotes: 0

Views: 425

Answers (1)

Darrin Holst
Darrin Holst

Reputation: 706

Here's the bug I think you're running into - http://bugs.jqueryui.com/ticket/6702. The sortable determines if the list is floating at creation time and since there are no items in the list it can't tell. Delaying initializing the sortable until the first item is added should fix it - http://jsfiddle.net/QMwfk/2/.

Upvotes: 1

Related Questions