Окончательная сортировка даты / времени в DataTable - в произвольном формате

Question

Может кто-нибудь, пожалуйста, помогите мне?Я пытаюсь использовать пользовательский формат сортировки для данных с плагином «конечная сортировка по дате / времени».Это частично работает ... и мне нужна помощь, чтобы завершить работу.

У меня есть таблица, и в одном из столбцов с именем "Laufzeit" будет отображаться время выполнения из заявки.Я позволил моей базе данных sql вычислить разницу между полем datetime и NOW ().Затем я использую javascript для преобразования формата на стороне клиента в формат, который вы можете увидеть в JSFiddle.

Формат выглядит следующим образом: 6 Tage 09:47:15 (дни 'Tage' час: минуты: секунды)

Для сортировки я пытаюсь это: https://datatables.net/blog/2014-12-18 Пока это работает, за исключением одной маленькой вещи ... когда данные показывают "0 дней", они сортируются впоследняя позиция, а не первая.Остальная сортировка верна.

Может кто-нибудь помочь мне?Благодарю.:)

borsTiHD

<table class="dataTable" id="example"><tbody>
  <tr>
    <td>0 Tage 00:33:21</td>
  </tr>
  <tr>
    <td>1 Tage 02:39:24</td>
  </tr>
  <tr>
    <td>1 Tage 03:18:25</td>
  </tr>
  <tr>
    <td>1 Tage 03:47:15</td>
  </tr>
  <tr>
    <td>2 Tage 06:47:15</td>
  </tr>
  <tr>
    <td>3 Tage 08:47:15</td>
  </tr>
  <tr>
    <td>4 Tage 18:47:15</td>
  </tr>
  <tr>
    <td>6 Tage 09:47:15</td>
  </tr>
  <tr>
    <td>13 Tage 05:26:59</td>
  </tr>
  <tr>
    <td>13 Tage 18:24:24</td>
  </tr>
  <tr>
    <td>20 Tage 12:12:13</td>
  </tr>
  <tr>
    <td>21 Tage 18:24:56</td>
  </tr>
  <tr>
    <td>34 Tage 22:59:59</td>
  </tr>
  <tr>
    <td>0 Tage 00:11:06</td>
  </tr>
  <tr>
    <td>0 Tage 00:24:22</td>
  </tr>
</tbody></table>

<script>
$.fn.dataTable.moment( 'DDD [Tage] HH:mm:ss' );

Table = $("#example").DataTable( {
    paging: false,
    searching: false,
    responsive: true,
    "bInfo" : true,
    "ordering": true,
    "columns": [
        { title: "Laufzeit:" },
    ],
});
</script>

PS: Моя скрипка: https://jsfiddle.net/borsTiHD/Lcnaq5gu/

Answer 1

'0' не является действительным днем ​​в году документация .Когда он анализируется на текущую дату, вместо этого будет изменена текущая дата.Вот пример:

console.log(moment('1 Tage 01:20:35', 'DDD [Tage] HH:mm:ss').format()) // 1st january
console.log(moment('15 Tage 01:20:35', 'DDD [Tage] HH:mm:ss').format()) // 15th january
console.log(moment('32 Tage 01:20:35', 'DDD [Tage] HH:mm:ss').format()) // 1st february
console.log(moment('0 Tage 01:20:35', 'DDD [Tage] HH:mm:ss').format()) // current date

<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.8.4/moment.min.js"></script>

---

Таким образом, чтобы поддерживать 0 дней в году, вам нужно написать собственную функцию сортировки, которая будет анализировать ваш ввод и обрабатывать сортировку.Я написал довольно простой пример с использованием регулярных выражений ( tests ) и добавлением предоставленных дат к текущей дате:

var types = $.fn.dataTable.ext.type;

// Add type detection
types.detect.unshift(function(d) {
  return parseDate(d) ? 'custom-moment' : null;
});

// Add sorting method - use an integer for the sorting
types.order['custom-moment-pre'] = function(d) {
  return moment().add(parseDate(d)).unix();
};

function parseDate(d) {
  //Format: DDD [Tage] HH:mm:ss
  var parsedDate = d.match(/^\s*(\d+) Tage (\d+):(\d+):(\d+)\s*$/);
  if (!parsedDate) {
    return undefined;
  }
  return {
    days: parsedDate[1],
    hours: parsedDate[2],
    minutes: parsedDate[3],
    seconds: parsedDate[4]
  }
}

Table = $("#example").DataTable({
  paging: false,
  searching: false,
  responsive: true,
  "bInfo": true,
  "ordering": true,
  "columns": [{
    title: "Laufzeit:"
  }, ],
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/1.10.16/js/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.8.4/moment.min.js"></script>
<link rel="stylesheet" href="https://cdn.datatables.net/1.10.16/css/jquery.dataTables.min.css">

<table class="dataTable" id="example"><tbody>
  <tr>
    <td>0 Tage 00:33:21</td>
  </tr>
  <tr>
    <td>1 Tage 02:39:24</td>
  </tr>
  <tr>
    <td>1 Tage 03:18:25</td>
  </tr>
  <tr>
    <td>1 Tage 03:47:15</td>
  </tr>
  <tr>
    <td>2 Tage 06:47:15</td>
  </tr>
  <tr>
    <td>3 Tage 08:47:15</td>
  </tr>
  <tr>
    <td>4 Tage 18:47:15</td>
  </tr>
  <tr>
    <td>6 Tage 09:47:15</td>
  </tr>
  <tr>
    <td>13 Tage 05:26:59</td>
  </tr>
  <tr>
    <td>13 Tage 18:24:24</td>
  </tr>
  <tr>
    <td>20 Tage 12:12:13</td>
  </tr>
  <tr>
    <td>21 Tage 18:24:56</td>
  </tr>
  <tr>
    <td>34 Tage 22:59:59</td>
  </tr>
  <tr>
    <td>0 Tage 00:11:06</td>
  </tr>
  <tr>
    <td>0 Tage 00:24:22</td>
  </tr>
</tbody></table>