I'm using a jQuery UI sortable with a table (works fine). I would like to make the header and last row fixed (non-moveable).

The jQuery UI docs indicate this can be done using a selector for items, but I am at a loss for the syntax.

Here is the relevant code:

<script type="text/javascript">
    $(function () {
    $("#response_options tbody.content").sortable();
    $("#response_options tbody.content").disableSelection();
});
</script>

<table id="response_options" class="data-table">
    <tbody class="content">
        <tr>
            <th>Links</th><th>Response</th>
        </tr>
        <tr class="sortable-row">
           <td>Edit</td>
           <td>Item 1</td>
        </tr>
        <tr class="sortable-row">
            <td>Edit</td>
            <td>Item 2</td>
        </tr>
        <tr class="sortable-row">
            <td>Edit</td>
            <td>Item 3</td>
        </tr>
        <tr class="sortable-row">
            <td>Edit</td>
            <td>Item 4</td>
        </tr>
        <tr class="sortable-row">
            <td>Edit</td>
            <td>Item 5</td>
        </tr>
        <tr>
            <td>Edit</td>
            <td>Item 1</td>
        </tr>
    </tbody>
</table>

The selector goes inside .sortable(...):

$("#response_options tbody.content").sortable();

as

$("#response_options tbody.content").sortable( items: ??? );

and it should be possible to select only items with class="sortable-row"; but again, I am at a loss for the syntax.

Edit
Report