Forcing an item to remain in place in a jQuery UI Sortable list

Posted by calumbrodie on Stack Overflow See other posts from Stack Overflow or by calumbrodie
Published on 2010-03-27T12:37:47Z Indexed on 2010/03/27 12:43 UTC
Read the original article Hit count: 531

I've set up a jQuery sortable list but I need to be able to keep some items in the sortable 'fixed' in place and for the other items to sort around them. I thought that there would be built in methods to achieve this, alas this is not the case.

I'm able to set up the list and not include the items in question:

<ul id="fruit">
    <li class="fixed">apples</li>
    <li>oranges</li>
    <li>bananas</li>
    <li>pineapples</li>
    <li>grapes</li>
    <li class="fixed">pears</li>
    <li>mango</li>
</ul>

<script type="text/javascript">
    $('#fruit').sortable({items: "li:not('.fixed')"})
</script>

This stops me from drag/dropping these items but they still move if the items around them are sorted. There may be a way to do this using the many callbacks that this method has but I've been unable to work this out.

Maybe this method would be a good addition to the UI Sortable options?

© Stack Overflow or respective owner

Related posts about jQuery

Related posts about jquery-ui