Запуск Tablesorter для сортировки при вставке записи в таблицу - PullRequest
Новая
       13

Запуск Tablesorter для сортировки при вставке записи в таблицу

0 голосов
/ 16 февраля 2019

У меня есть таблица, которая использует сортировщик таблиц, и, хотя сортировка работает правильно, я сталкивался со случаем, когда таблица выходит из строя.То есть, когда запись добавляется в таблицу, таблица больше не упорядочивается.Как я могу запустить сортировщик таблиц, чтобы поддерживать текущее состояние сортировки (т. Е. Восходящий, нисходящий) с помощью обработчика щелчка.

В настоящее время я пишу свой собственный алгоритм сортировки для обработки в этом конкретном случае, но, похоже,как будто это может быть потрачено впустую, если существует решение для сортировки таблиц. 

addEntry.click(function() {
    // code that triggers the sort again
});

1 Ответ

0 голосов
/ 16 февраля 2019

Вы можете использовать свойство sortlist при инициализации виджета и триггере addRows после добавления новой строки.

В любом случае вы всегда можете вызвать событие clickв заголовке таблицы для столбца, который нужно отсортировать.

Фрагмент: 

//
// set sort on first column in descending order and 
// on second column in ascending order
//
$("#myTable").tablesorter({ sortList: [[0,1], [1,0]] });
$('#addNewRow').on('click', function(e) {
    var newRow = $('<tr><td>z</td><td>a</td></tr>');
    $("#myTable tbody").append(newRow).trigger('addRows', [newRow, true]);
});

$('#sortOnFirstCol').on('click', function(e) {
    $("#myTable th:first").trigger('click');
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery.tablesorter/2.31.1/css/theme.default.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.tablesorter/2.31.1/js/jquery.tablesorter.min.js"></script>

<button id="addNewRow">Add new Row</button>
<button id="sortOnFirstCol">Sort on first column</button>
<table id="myTable" class="tablesorter">
    <thead>
    <tr>
        <th>Last Name</th>
        <th>First Name</th>
    </tr>
    </thead>
    <tbody>
    <tr>
        <td>Smith</td>
        <td>John</td>
    </tr>
    <tr>
        <td>Bach</td>
        <td>Frank</td>
    </tr>
    <tr>
        <td>Doe</td>
        <td>Jason</td>
    </tr>
    <tr>
        <td>Conway</td>
        <td>Tim</td>
    </tr>
    </tbody>
</table>
...