Question

我有一个正在使用表排序器的表，当排序正常工作时，我遇到了表混乱的情况。即，当将条目添加到表时，该表不再被排序。如何通过点击处理程序触发表格排序器以维持其当前排序状态（即升序，降序）。

当前，我正在编写自己的排序算法来处理这种特殊情况，但是如果存在表排序器解决方案，这似乎是一种浪费。

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

Answer 1

您可以在初始化窗口小部件时使用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>

将条目插入表中时触发Tablesorter保持排序

1 个答案: