Jquery Datatable Sort by date Error

Question

Here is the code ..

     $.fn.dataTableExt.oSort['us_date-asc'] = function (a, b) { 

        var x = new Date(a),
         y = new Date(b);
        return ((x < y) ? -1 : ((x > y) ? 1 : 0));
    };

    $.fn.dataTableExt.oSort['us_date-desc'] = function (a, b) {
        var x = new Date(a),
         y = new Date(b);
        return ((x < y) ? 1 : ((x > y) ? -1 : 0));
    };

    var oTable = $('#example').dataTable({
        "bJQueryUI": true,
        "sPaginationType": "full_numbers",
        //"bSortClasses": false,
        "aoColumns": [
        null, null,
        {
            "sType": "us_date"
        },
        null,
        {
            "bSortable": false
        }],
        "aaSorting": [
            [2, "desc"]
        ]
    });

Am using this code for the datatable to make the third column sortable. I want to display date in jun-06-2012 format .The sorting works fine when am using 06-06-2012 format... but sorting does not work(it works in chrome but not in other browsers) when month is represented alphabetically... How can i tackle this ? Any help will be appreciated

Answer 1

You could use a library like datejs to convert arbit strings to actual Date objects and compare those. The idea is to separate what you are displaying from what you actually compare.

Sample code:

var x = Date.parse('06-jun-2012');
var y = Date.parse('06-jul-2012');
return Date.compare(x, y);

You can use the date objects toString() method and specify a custom format string. Check the documentation http://code.google.com/p/datejs/wiki/APIDocumentation

You might not want to take on the dependency of another library if this happens to be a one off task. If you however happen to be manipulating dates all over your app, you would want to use this library.

Answer 2

jQuery.fn.dataTableExt.oSort['shortdate-asc']  = function(x,y) {
        var months = {}; 
                months["JAN"] = "01"; 
                months["FEB"] = "02"; 
                months["MAR"] = "03"; 
                months["APR"] = "04"; 
                months["MAY"] = "05"; 
                months["JUN"] = "06"; 
                months["JUL"] = "07"; 
                months["AUG"] = "08"; 
                months["SEP"] = "09"; 
                months["OCT"] = "10"; 
                months["NOV"] = "11"; 
                months["DEC"] = "12";

        x = (x=="")? 0 : x.split('-');
        y = (y=="")? 0 : y.split('-');

        if(x.length){
            x = x[2] + months[x[0].toUpperCase()] + x[1];
        }

        if(y.length){
            y = y[2] + months[y[0].toUpperCase()] + y[1];
        }



        return ((x < y) ? -1 : ((x > y) ?  1 : 0)); 
    }; 


    jQuery.fn.dataTableExt.oSort['shortdate-desc']  = function(x,y) { 

        var months = {}; 
                months["JAN"] = "01"; 
                months["FEB"] = "02"; 
                months["MAR"] = "03"; 
                months["APR"] = "04"; 
                months["MAY"] = "05"; 
                months["JUN"] = "06"; 
                months["JUL"] = "07"; 
                months["AUG"] = "08"; 
                months["SEP"] = "09"; 
                months["OCT"] = "10"; 
                months["NOV"] = "11"; 
                months["DEC"] = "12";

        x = (x=="")? 0 : x.split('-');
        y = (y=="")? 0 : y.split('-');

        if(x.length){
            x = x[2] + months[x[0].toUpperCase()] + x[1];
        }

        if(y.length){
            y = y[2] + months[y[0].toUpperCase()] + y[1];
        }

        return ((x < y) ?  1 : ((x > y) ? -1 : 0)); 
    };