NOTE!
- Parse Dates with these parsers
- The "Date" column is using the sugar library to parse dates. Make sure to include the sugar library and the sugar-date-parser.
- The "Weekday" column uses the included "weekday" parser. You can modify parser to match whatever language you are using.
- The "Month" column uses the included "month" parser. You can also modify the month names within the parser to match whatever language you are using.
- The "Year" column is just using the included two digit year parser:
- Formats for "mmddyy", "ddmmyy" and "yymmdd" are available
- Within the parser code is a
rangevariable which is set to50years range, which sets the date be within +/- range of the listed two digit year. - So if the current year is
2020, and the listed two digit year is80(2080 - 2020 > 50), it becomes1980. - If the listed two digit year is
50(2050 - 2020 < 50), then it becomes2050. I hope that makes it clearer. - Try out the two digit year calculator below the table.
- In New v2.14.0, the range can be set using the
dateRangeoption (see the initialization code below).
- The "Time" column is using the built-in time parser which has been always been included with tablesorter .
Demo
Date |
Weekday |
Month |
MM/DD/YY |
Time |
|---|---|---|---|---|
| next friday | Friday | Aug | 1/1/12 | 12:00 PM |
| today | Thurs | September | 1/1/12 | 00:00 |
| last Tuesday | Fri | Mar | 1/1/10 | 18:00 |
| the day after tomorrow | Wed | July | 1/1/13 | 13:00 |
| 2010-05-25T12:30:40.299+01:00 | Monday | Jan | 1/1/11 | 1:30 PM |
| May 25th of next year | Tues | Nov | 1/1/11 | 14:00 |
| 25 May 2010 | Tuesday | November | 1/1/11 | 1:58 PM |
| the last day of March | Mon | December | 1/1/12 | 2:10 PM |
| last month | Wednesday | April | 1/1/14 | 13:50 |
| one day before yesterday | Thursday | Feb | 1/1/08 | 4:00 AM |
Two digit year calculator:
two digit year becomes 2045
(
)
Page Header
<!-- blue theme stylesheet with additional css styles added in v2.0.17 -->
<link rel="stylesheet" href="../css/theme.blue.css">
<!-- tablesorter plugin -->
<script src="../js/jquery.tablesorter.js"></script>
<!-- load month, weekday and two digit year parsers -->
<script src="../js/parsers/parser-date-month.js"></script>
<script src="../js/parsers/parser-date-weekday.js"></script>
<script src="../js/parsers/parser-date-two-digit-year.js"></script>
<!-- http://sugarjs.com/dates#comparing_dates -->
<script src="../js/sugar.js"></script>
<script src="../js/parsers/parser-date-sugar.js"></script>
Javascript
$(function() {
// call the tablesorter plugin
$("table").tablesorter({
theme : 'blue',
widgets : ["zebra"],
// date range used by the two-digit year parser (added v2.14.0)
dateRange : 30
});
});
HTML
<table class="tablesorter">
<thead>
<tr>
<th class="sorter-sugar">Date</th>
<th class="sorter-weekday">Weekday</th>
<th class="sorter-month">Month</th>
<th class="sorter-mmddyy">MM/DD/YY</th> <!-- "sorter-ddmmyy" also available -->
<th class="sorter-time">Time</th>
</tr>
</thead>
<tbody>
<tr><td>next friday</td><td>Friday</td><td>Aug</td><td>1/1/12</td><td>12:00 PM</td></tr>
<tr><td>today</td><td>Thurs</td><td>September</td><td>1/1/12</td><td>00:00</td></tr>
<tr><td>last Tuesday</td><td>Fri</td><td>Mar</td><td>1/1/10</td><td>18:00</td></tr>
<tr><td>the day after tomorrow</td><td>Wed</td><td>July</td><td>1/1/13</td><td>13:00</td></tr>
<tr><td>2010-05-25T12:30:40.299+01:00</td><td>Monday</td><td>Jan</td><td>1/1/11</td><td>1:30 PM</td></tr>
<tr><td>May 25th of next year</td><td>Tues</td><td>Nov</td><td>1/1/11</td><td>14:00</td></tr>
<tr><td>25 May 2010</td><td>Tuesday</td><td>November</td><td>1/1/11</td><td>1:58 PM</td></tr>
<tr><td>the last day of March</td><td>Mon</td><td>December</td><td>1/1/12</td><td>2:10 PM</td></tr>
<tr><td>last month</td><td>Wednesday</td><td>April</td><td>1/1/14</td><td>13:50</td></tr>
<tr><td>one day before yesterday</td><td>Thursday</td><td>Feb</td><td>1/1/08</td><td>4:00 AM</td></tr>
</tbody>
</table>