Datatables Datetime извлекает минуты и добавляет класс CSS

Question

Использование Datatables v1.10

В настоящее время моя таблица отображает дату во втором столбце в этом формате 17-04-2019 14:34. Это формат, возвращаемый базой данных. Все работает как положено, фильтрация и поиск.

В настоящее время ячейка таблицы HTML выглядит следующим образом:

<td class="sorting_1">17-04-2019 14:34</td>

Я хочу выбрать минут в каждой ячейке и добавить вокруг них собственный класс CSS, что-то вроде этого

<td class="sorting_1">17-04-2019 <span class="text-muted">14:34</span></td>

мой код данных ниже;

$(document).ready(function() {
  $('#example').DataTable({
    "columns": [
      {
        data: 'date',
        "render": function(data, type, row) {
          return data;
          // console.log(data) displays a string 
          // in this format 17-04-2019 14:34
        },
      }
    ],
  });
});

Я пытался использовать метод JavaScript String split (), но не могу заставить его работать.

Любая помощь приветствуется.

Answer 1

Попробуйте;

$(document).ready(function() {
  $('#example').DataTable({
    "columns": [
      {
        data: 'date',
        "render": function(data, type, row) {
          var array = row['datePaid'].split(" ");
          var date = array[0];
          var mins = array[1];
          data = date + ' ' + '<span class="text-muted">' + mins + '</span>';
          return data;
          // console.log(data) displays a string 
          // in this format 17-04-2019 14:34
        },
      }
    ],
  });
});

Я уверен, что есть более эффективные способы сделать это, но это должно сработать.

Answer 2

split() будет работать для этого.Затем вы можете вывести второй элемент в результирующем массиве после переноса его в span, что-то вроде этого:

$(document).ready(function() {
  $('#example').DataTable({
    "columns": [{
      data: 'date',
      render: function(data, type, row) {
        var d = data.split(' ');
        return `${d[0]} <span class="text-muted">${d[1]}</span>`;
      },
    }],
  });
});

Другой альтернативой будет использование регулярного выражения:

render: function(data, type, row) {
  return data.replace(/^([\d-]+)\s([\d:])+$/, '$1 <span class="text-muted">$2</span>')
},