Take the 2-minute tour ×

I have a list of elements that work fine with jQuery UI sortable, but now I want to be able to group some adjacent siblings together. Is there a direct way of doing that, similar to the way a rich-text document has a keep-together or keep-with-next attribute on paragraphs?

For example, if I have items 123456, what’s the best way to keep 2 & 3 together, so that a) If I drag either 2 or 3, then they move together and b) It's not possible to drop something between 2 and 3?

share|improve this question

1 Answer 1

My solution was to add a wrapper around the grouped elements with help from jQuery methods replaceWith() to remove the wrapper and wrapAll() to wrap the group. This requires some juggling if what you start with expects the individual elements to be direct children, but if you're referencing those elements by a class selector, it should go pretty easily.

I also wanted to be able to optionally lock the first and last items in place, and the solution there was to get a subset of the direct children and omit or include the first/last elements via slice().

If there's enough interest from anyone other than me, I’ll post some example code fragments.

share|improve this answer
Can you add that code fragment if you still have it? –  Chad Apr 24 '12 at 17:27

Your Answer


