1

Hi could someone help me understand why this script only works on safari, it's meant to oder the table from newest to oldest but I can't understand why it only functions correctly in safari

Obviously I'd like it to work with Chrome, firefox and edge

I've tried every jquery version but it's only working for safari

$('tr.Entries').each(function() {
  var $this = $(this),
    t = this.cells[1].textContent.split('-');
  $this.data('_ts', new Date(t[2], t[1] - 1, t[0]).getTime());
}).sort(function(a, b) {
  return $(a).data('_ts') > $(b).data('_ts');
}).appendTo('tbody');
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table class="table-bordered" border="1">
  <thead>
    <tr class="Headers">
      <th>Number</th>
      <th>uploaded</th>
      <th>file</th>
    </tr>
  </thead>
  <tbody>
    <tr class="Entries" data-id="13">
      <td data-field-type="string">1234</td>
      <td data-field-type="date">01/04/2015 03:21:44pm</td>
      <td>9393939828282</td>
    </tr>
    <tr class="Entries" data-id="24">
      <td data-field-type="string">1352</td>
      <td data-field-type="date">04/10/2012 12:31:09pm</td>
      <td>1238383</td>
    </tr>
    <tr class="Entries" data-id="8">
      <td data-field-type="string">1124</td>
      <td data-field-type="date">13/05/2014 02:51:12pm</td>
      <td>0934899</td>
    </tr>
    <tr class="Entries" data-id="23">
      <td data-field-type="string">1652</td>
      <td data-field-type="date">07/11/2013 08:19:59pm</td>
      <td>929474900</td>
    </tr>
    <tr class="Entries" data-id="23">
      <td data-field-type="string">1652</td>
      <td data-field-type="date">04/12/2013 07:21:43pm</td>
      <td>8837483</td>
    </tr>
  </tbody>
</table>

5
  • 1
    This is not java. Please keep in mind, java and javascript are entirely different things, like car and carpet are. stackoverflow.com/questions/245062/… Commented Jul 1, 2020 at 10:48
  • Can you open your web console in - say - chrome and tell us what you see there? May it be that you see Content Security Policy issues? Commented Jul 1, 2020 at 10:52
  • @MarekPuchalski three messages appear but the only 'error' that also appears on my site is "DevTools failed to load SourceMap: Could not load content for jsfiddle.net/js/createStream.js.map: HTTP error: status code 404, net::ERR_HTTP_RESPONSE_CODE_FAILURE" so it would seem I need to add a normalize.min.css.map Commented Jul 1, 2020 at 10:58
  • @Clijsters yes sorry typo I'll correct the title Commented Jul 1, 2020 at 10:59
  • 1
    That is an error from a plugin. I have that all the time Commented Jul 1, 2020 at 11:43

1 Answer 1

1

Perhaps you meant to do this?

const re = /(\d{2})\/(\d{2})\/(\d{4}) (\d{2})\:(\d{2})\:(\d{2})(\w{2})/

const makeDate = ($tr) => {
  const [, dd, mm, yyyy, hh, mi, ss, mer] = $("[data-field-type=date]", $tr).eq(0).text()
    .match(re);
  const dString = `${mm}/${dd}/${yyyy} ${hh}:${mi}:${ss} ${mer.toUpperCase()}`;
  return new Date(dString).getTime()
};
const tbSort = tableId => {
  const $tb = $("#" + tableId + " tbody");
  $tb.append(
    $('tr.Entries', $tb).sort((a, b) => makeDate($(b)) - makeDate($(a))) // descending
  );
};

tbSort("table1")
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table class="table-bordered" id="table1" border="1">
  <thead>
    <tr class="Headers">
      <th>Number</th>
      <th>uploaded</th>
      <th>file</th>
    </tr>
  </thead>
  <tbody>
    <tr class="Entries" data-id="13">
      <td data-field-type="string">1234</td>
      <td data-field-type="date">01/04/2015 03:21:44pm</td>
      <td>9393939828282</td>
    </tr>
    <tr class="Entries" data-id="24">
      <td data-field-type="string">1352</td>
      <td data-field-type="date">04/10/2012 12:31:09pm</td>
      <td>1238383</td>
    </tr>
    <tr class="Entries" data-id="8">
      <td data-field-type="string">1124</td>
      <td data-field-type="date">13/05/2014 02:51:12pm</td>
      <td>0934899</td>
    </tr>
    <tr class="Entries" data-id="23">
      <td data-field-type="string">1652</td>
      <td data-field-type="date">07/11/2013 08:19:59pm</td>
      <td>929474900</td>
    </tr>
    <tr class="Entries" data-id="23">
      <td data-field-type="string">1652</td>
      <td data-field-type="date">04/12/2013 07:21:43pm</td>
      <td>8837483</td>
    </tr>
  </tbody>
</table>

Sign up to request clarification or add additional context in comments.

1 Comment

Comments are not for extended discussion; this conversation has been moved to chat.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.