DataTables 时刻按自定义格式排序

Posted 2023-05-07

【中文标题】DataTables 时刻按自定义格式排序

【英文标题】：DataTables moment sort by custom format

【发布时间】：2019-03-03 04:03:03

【问题描述】：

我正在使用 DataTables 和 moment，并且我的表上有自定义日期格式。 如何按时刻对列进行排序？ 在这里您可以看到排序无法正常工作 updated_at 列。 我正在使用数据表时刻。模型上的 Carbon 已经更改了 Update_at 格式。

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


<div class="table-responsive">
  <table id="tickets-table" class="table table-bordered">
    <thead>
      <tr>
        <th>Name</th>
        <th>User name</th>
        <th>Last update</th>
      </tr>
    </thead>
    <tbody>
      <tr>
        <td>saddsfdsafdfsafsa</td>
        <td>Sqe Begush</td>
        <td>1 hour ago</td>
      </tr>
      <tr>
        <td>testing</td>
        <td>User name</td>
        <td>8 hours ago</td>
      </tr>
      <tr>
        <td>another</td>
        <td>another user</td>
        <td>4 days ago</td>
      </tr>
      <tr>
        <td>another testing</td>
        <td>user user</td>
        <td>1 week ago</td>
      </tr>
      <tr>
        <td>another testingsss</td>
        <td>user user11</td>
        <td>1 year ago</td>
      </tr>
      <tr>
        <td>another test</td>
        <td>user userqww11</td>
        <td>4 months ago</td>
      </tr>
    </tbody>
  </table>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.8.4/moment.min.js"></script>
<script src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js">
</script>
<script src="https://cdn.datatables.net/1.10.19/js/dataTables.bootstrap4.min.js"></script>
<script src="//cdn.datatables.net/plug-ins/1.10.12/sorting/datetime-moment.js"></script>
<script>
  $(document).ready(function() 
    //$.fn.dataTable.moment("YYYY/MM/DD");
    $('.table').DataTable();
  );
</script>

【参考方案1】：

日期的来源尚不清楚。如果你自己传递了moment().fromNow()，那么当display 类型为sort 时停止传递（见下文）。如果您从某个来源获得已格式化的数据，则可以使用 chrono 之类的库，它可以将“人类日期”解析为“系统日期”：

var table = $('#tickets-table').DataTable(
  columnDefs: [
     targets: 2,
      render: function(data, type) 
        if (type == 'sort') 
          var date = chrono.parseDate(data)
          return new Date(date).valueOf()
         
        return data
      
    
  ]
)  

上面<table>的演示 -> http://jsfiddle.net/mw0c3f91/

【参考方案2】：

您必须将列日期转换为所需格式，然后对表格进行排序。

moment(col[0]).fromNow();