Using jQuery tablesorter to sort mm/yy dates

I am using the jquery tablesorter plugin to sort a table. On of my the columns in my table shows the date in mm/yy format.

<tr>
    <td class="col-name">...</td>
    ...
    <td rel="2000" class="col-dob">10/00</td>
    ...
</tr>
<tr>
    <td class="col-name">...</td>
    ...
    <td rel="1986" class="col-dob">11/86</td>
    ...
</tr>

Note:

  • Each cell has a unique class
  • Date is displayed in the mm/yy format
  • Cell with date receives the year as well

My jQuery code is as below:

// add parser through the tablesorter addParser method
$.tablesorter.addParser({
        // set a unique id
        id: 'user-birthdate',
        is: function(s) {
                // return false so this parser is not auto detected
                return false;
        },
        format: function(s) {
                // format your data for normalization

                var dateSplit = s.split('/');

                if(2 !== dateSplit.length)
                        return 0;

                return new Date(dateSplit[1], dateSplit[0], 1);
        },
        // set type, either numeric or text
        type: 'numeric'
});

myClass.init = function() {
        $('.module .user table').tablesorter({
                sortList: [[0,0]],     
             widgets: ['zebra'],
                headers: {
                        5: {
                                sorter:'user-birthdate'
                        }
                }
        });
}

myClass.init();

My problem is that the tableSorter interprets 00 as year 1900 instead of 2000 and hence the sorted data is not correct.

Any clue how can I resolve this? I am using jQuery 1.2.6 and the latest version of tablesorter.

Add Comment
2 Answer(s)

The tablesorter documentation is often rather unhelpful, I’ve found. It looks like it says a lot, but is lacking in the details.

In this case, it doesn’t tell you the function signature for a parser. Fortunately, you can read the unminified code to find it.

There we find that the metadata parser does this:

format: function(s,table,cell) {

This means that you can adjust your format method to:

format: function(s, table, cell) {
    // format your data for normalization

    var dateSplit = s.split('/');
    var year = $(cell).attr('rel');

    if(2 !== dateSplit.length)
        return 0;

    return new Date(year, dateSplit[0], 1);
},

Or at least similar to that. I haven’t actually tested this. But it should be at least very close.

Answered on July 11, 2016.
Add Comment

I think you will find that your problem is the Date constructor and the 2-digit year string you are passing without disambiguation: new Date(dateSplit[1], dateSplit[0], 1);

I don’t think you can (easily) get access to rel based on s in the parser. Does s contain the entire contents of the cell? Can you do something in the data in the cell like: <span style="display : none">CC</span>MM/YY, strip out the tags and then combine CC with YY in your parse?

Answered on July 11, 2016.
Add Comment

Your Answer

By posting your answer, you agree to the privacy policy and terms of service.