DataTables

DataTables Examples

HTML

<link rel="stylesheet" href="//cdn.datatables.net/1.10.0/css/jquery.dataTables.css">
<script src="https://cdn.datatables.net/1.10.9/js/jquery.dataTables.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.22.2/moment.js"></script>
<script src="https://cdn.datatables.net/plug-ins/1.10.19/sorting/datetime-moment.js"></script>
<table id="example">
        <thead>
            <tr>
                <th>date</th>
                <th>date + time</th>
            </tr>
        </thead>
        <tbody>
<tr><td>20.01.2018</td><td>20.01.2018 09:00</td></tr>                 
<tr><td>12.02.2019</td><td>12.02.2019 16:00</td></tr>                 
<tr><td>13.06.2017</td><td>13.06.2017 09:00</td></tr>                 
<tr><td>20.01.2018</td><td>20.01.2018 16:00</td></tr>                 
<tr><td>01.10.2016</td><td>01.10.2016 09:00</td></tr>        
<tr><td>12.10.2018</td><td>12.10.2018 16:00</td></tr>                
<tr><td>21.10.2017</td><td>21.10.2017 09:00</td></tr>           
<tr><td>04.10.2018</td><td>04.10.2018 16:00</td></tr>            
<tr><td>13.10.2018</td><td>13.10.2018 09:00</td></tr>        
<tr><td>01.11.2018</td><td>01.11.2018 16:00</td></tr>        

        </tbody>
    </table>

CSS

body {
  font-family: sans-serif;
}

JavaScript

//$.fn.dataTable.moment( 'DD.MM.YYYY' ); // uncomment this to sort column 1 correctly
$.fn.dataTable.moment( 'DD.MM.YYYY HH:mm' ); // this sorts column 2 (date and time) correctly

$('#example').DataTable()