In the past week I have dealt with two different needs to sort a table date column (using a custom date format) using a JS plugin jQuery Tablesorter 2.0 and Bootstrap Table.
If you use custom date formats – the default sort will not always work. In my case – it was sorting the dates by month name alphabetically and not by date order. Here is how you can use both plugins to sort by date order:
Example date format: Jan 28-Jan 31 (date for this example was a span of dates – in which I wanted to sort by the starting date)
Custom date sort solution in two steps for jQuery Tablesorter and Bootstrap Table:
jQuery Tablesorter
- Add data to the table header:
<th data-sorter="shortDate" data-date-format="yyyymmdd">Date</th>
- Add a hidden span before your actual date in the data that then matches the format specificed above:
<span style="display:none"><?php echo date( "Ymd", strtotime($date) ));?></span> Jan 28-Jan 31
Very similar to the jQuery Tablesorter solution:
Bootstrap Table
- Add data to the table header:
<th data-field="created" data-sortable="true">Created</th>
- Add a hidden span before your actual date in the data that then matches the format specificed above:
<span style="display:none"><?php echo date( "Ymd", strtotime($date) ));?></span> Jan 28-Jan 31
Now you can easily sort any date format using these two plugins so you can format the date however you want and still be able to sort by date on that column.
