Как использовать многоколоночное упорядочение с одним столбцом в дес c?

Question

Это мои данные:

NAME   SORT
Adam
Ali    101
David  102
Laura
Will

Я пытаюсь отсортировать свою таблицу по столбцу name, а также по столбцу sort.

Результат, который я ищу:

NAME   SORT
David  102  
Ali    101  
Adam
Laura
Will

Это означает, что все, что имеет номер сортировки, должно сортироваться по столбцу sort, а все остальное - name.

Это мой подход:

var table = $('.datatable').DataTable({
"order": [[ 0, "asc" ]],
"columnDefs": [
  {
        "targets": [ 0 ],
        "orderData": [ 0, 1 ]
      },
],
...

Но он не работает. Столбцы отсортированы только по name. Если я изменю код на:

  var table = $('.datatable').DataTable({
    "order": [[ 0, "asc" ]],
    "columnDefs": [
      {
            "targets": [ 0 ],
            "orderData": [ 1, 0 ]
          },
    ],
    ...

Сейчас рассматриваются оба столбца для сортировки, но второй столбец упорядочен в неправильном направлении:

NAME   SORT
Adam
Laura
Will
Ali    101  
David  102  

Answer 1

ОБНОВЛЕНИЕ : я пропустил один элемент в своем первоначальном сообщении. Теперь я исправил демо из этого "orderData": [ 2 ] в "orderData": [ 2, 0 ].

Два варианта:

Предлагаемый подход

Демо-таблица:

$(document).ready(function () {

  var data = [
    { "name": "Adam", "sort": null }, 
    { "name": "Ali", "sort": 101 }, 
    { "name": "David", "sort": 102 }, 
    { "name": "Will", "sort": null },
    { "name": "Laura", "sort": null } 
  ];

  $("#myTable").DataTable({
    data: data,
    columns: [
      { "data": "name", "orderData": [ 2, 0 ] },
      { "data": "sort" },
      { "data": null, "visible" : false,
          "render": function ( data, type, row, meta ) {
            return (!row.sort ? 999 : row.sort * -1);
          } 
        }
    ],
    order: [ [ 1, "desc" ], [ 0, "asc" ] ]
  });

});

Мы ввели новый (скрытый) столбец, содержащий следующие данные - не скрытые только для этого снимка экрана:

Следующие причины этого 3-го Данные столбца, которые будут использоваться при сортировке по столбцу 1 (за которым следуют данные в столбце 1 - индекс 0):

{ "data": "name", "orderData": [ 2, 0 ] },

В этом случае «2» относится к столбцу 3 - индексирование столбца начинается с 0 .

Альтернатива

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

Демонстрационная таблица:

$(document).ready(function () {

  var data = [
    { "name": "Adam", "sort": null }, 
    { "name": "Ali", "sort": 101 }, 
    { "name": "David", "sort": 102 }, 
    { "name": "Will", "sort": null },
    { "name": "Laura", "sort": null }
  ];

  $("#myTable").DataTable({
    data: data,
    columns: [
      { "data": "name" },
      { "data": "sort" }
    ],
    order: [ [ 1, "desc" ], [ 0, "asc" ] ]
  });

});

В этой строке задается начальный порядок сортировки:

order: [ [ 1, "desc" ], [ 0, "asc" ] ]

При первом отображении таблицы вы получаете следующее:

Чтобы вернуться к этой начальной точке, пользователь должен сделать следующее:

1) Cli Нажмите на стрелку сортировки столбца 2, пока этот столбец не будет отсортирован правильно.

2) Удерживая нажатой клавишу SHIFT, нажимайте на столбец 1, пока столбец не будет отсортирован правильно.

Примечания

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

Предложенный подход сделает это автоматически, но пользователи не смогут получить "чистый" "alphabeti c сортировать по именам пользователей с помощью этой опции. Это может даже сбить с толку, если они не знают, почему данные упорядочены именно так.