jQuery DataTables: Unsorted View

Question

Поддерживает ли плагин jQuery DataTables понятие «несортированный» или «естественный порядок сортировки».

То есть - у меня есть таблица, где порядок, в котором строки распечатываются, является значительным.

<tr><td>One</td></tr> 
<tr><td>Two</td></tr> 
<tr><td>Three</td></tr> 

Случаи, когда пользователи захотят отсортировать их по алфавиту. Также есть моменты, когда они захотят увидеть их в том порядке, в котором они появляются в источнике HTML.

Короткие создания конкретного числового столбца, который отслеживает порядок сортировки

<tr><td>1</td><td>One</td></tr> 
<tr><td>2</td><td>Two</td></tr> 
<tr><td>3</td><td>Three</td></tr> 

Есть ли в DataTables плагин имеет поддержку для «неупорядоченный» рода. Поведение, которое я искал (что я видел в других пользовательских интерфейсах компьютера), - это то, где один клик сортируется в одну сторону, второй щелчок сортирует другой, а третий клик восстанавливает состояние «несортированное».

Answer 1

Существует плагин API для восстановления первоначального заказа. Включите плагин и вызовите order.neutral() на стол.

Если вы хотите добавить функциональность третьего клика, вам, вероятно, придется изменить обработчик кликов для стрелок сортировки.

$(document).ready(function() { 
 
    $('#example').DataTable({ 
 
     "order": [[ 0, "desc" ]] 
 
    }); 
 
    setTimeout(function(){ 
 
     var table = $('#example').DataTable(); 
 
     table.order.neutral().draw(); 
 
    },3000); 
 
});

<script src="https://code.jquery.com/jquery-1.12.0.min.js"></script> 
 
<script src="https://cdn.datatables.net/1.10.10/js/jquery.dataTables.min.js"></script> 
 
<script src="https://cdn.datatables.net/plug-ins/1.10.10/api/order.neutral().js"></script> 
 

 
<link rel="stylesheet" href="https://cdn.datatables.net/1.10.10/css/jquery.dataTables.min.css"> 
 

 
<table id="example" class="display" cellspacing="0" width="100%"> 
 
    <thead> 
 
    <tr><th>Column</th></tr> 
 
    </thead> 
 
    <tbody> 
 
    <tr><td>Sixteen</td></tr> 
 
    <tr><td>Two</td></tr> 
 
    <tr><td>Three</td></tr> 
 
    <tr><td>Boots</td></tr> 
 
    <tr><td>One</td></tr> 
 
    </tbody> 
 
</table>