Answers

• allan Posts: 63,350Questions: 1Answers: 10,443 Site admin

  March 2017

  Happy to take a look if you post a link to a test case. The epoch is just an integer, so there really shouldn't be any issue with the sorting element. More likely it isn't detecting that it should be sorting on that data point for whatever reason.

  Allan
• adie Posts: 2Questions: 1Answers: 0

  March 2017 edited March 2017

  Thanks for the reply Allan. I kinda figured out the issue. Seems like it was sorting by the date string instead of the epoch time data-order attribute. The order results were different on multiple browsers because of the system locale settings.

  $('#bucketContents').DataTable({
          "order": [[1, 'desc']],
          "info": true,
          "autoWidth": true,
          "search": {
              "smart": true,
              "caseInsensitive": true
          },
          "lengthMenu": [10, 20, 40, 60, 80, 100],
          "pagingType": "simple",
          "ajax": {
              "url": config.fetchFiles,
              "type": "GET",
              "dataSrc": function (data) {
                  return data.data;
              }
          },
          "columns": [{
              "data": "fileName",
              "sortable": false,
              "render": function (data, type, row) {
                  return '<div class="datatable-file-name">' + row.fileName + '</div>';
              }
          }, {
              "sortable": true,
              "orderable": true,
              "data": "lastModified",
              "render": function (data, type, row) {
                  var DateTime = new Date(parseInt(row.lastModified)).toLocaleString();
                  return '<div data-order="' + row.lastModified + '" class="datatable-file-name">' + DateTime + '</div>';
              }
          }, {
              "data": "status",
              "sortable": false,
              "render": function (data, type, row) {
                  return '<div class="datatable-file-name">' + row.status + '</div>';
              }
          }, {
              "searchable": false,
              "sortable": false,
              "render": function (data, type, row) {
                  var msgstates = ['fail', 'busy'];
                  var playstates = ['ready', 'done'];
                  if (playstates.indexOf(row.status) > -1) {
                      return '<button class="playVideo" data-videoname="' + row.fileName + '">Open</button></div></div>';
                  }
                  if (msgstates.indexOf(row.status) > -1) {
                      return '<pre>' + row.message + '</pre>';
                  }
                  return '<div></div>';
              },
              "targets": 0
          }]
      });
  
• allan Posts: 63,350Questions: 1Answers: 10,443 Site admin

  March 2017 Answer ✓

  If you are using columns.render as a function, what you return from it (when the type is sort) is what DataTables will use for the ordering data. In this case it is an HTML string - hence the issue.

  You want to return only row.lastModified under those conditions.

  See the orthogonal data section for more details.

  Regards,
  Allan