jQuery UI сортируется с фиксированными строками - PullRequest
Новая
       14

jQuery UI сортируется с фиксированными строками

9 голосов
/ 14 мая 2011

Я использую jQuery UI, сортируемый по таблице (работает нормально). Я хотел бы сделать заголовок и последнюю строку фиксированными (неподвижными).

Документация по пользовательскому интерфейсу jQuery указывает, что это можно сделать с помощью селектора для элементов, но я не понимаю синтаксиса.

Вот соответствующий код: 

<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>

Селектор переходит внутрь .sortable (...): 

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

1011 *, как * 

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

и должна быть возможность выбирать только элементы с class = "sortable-row"; но опять же, я в растерянности из-за синтаксиса.

Ответы [ 3 ]

11 голосов
/ 14 мая 2011

Это должно работать: 

$("#response_options tbody.content").sortable({items: 'tr.sortable-row'});
8 голосов
/ 13 марта 2013

Это сработало для меня: 

        jQuery(".sortable tbody").sortable({
            items: 'tr:not(:first)'
        });
4 голосов
/ 22 июня 2011

Для этой разметки: 

<table id="tableid">
    <thead>
        <tr>    
            <th>namr</th>
            <th>id</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>jagadeesh</td>
            <td>1</td>
        </tr>
        <tr>
            <td>jagadeesh</td>
            <td>2</td>
        </tr>
    </tbody>
</table>

Использовать этот jQuery: 

$('#tableid tbody').sortable();

Он будет перемещать только содержимое тела таблицы, вы не можете перемещать часть заголовка.

...