Question about Sorting by Date

Question about Sorting by Date

brilangbrilang Posts: 22Questions: 2Answers: 1
edited November 2012 in General
I have a DataTable that I want to sort by date/time. The dates are formated like this: Oct 30, 2012 1:10 PM OR the value is blank - meaning it's in the future.
I want blank values to be at the top of the list, followed by date in descending order (November 6, November 5, November 4.)
The default sort for the column doesn't seem to work the way I want it to.

Can someone help me figure out how to sort dates descending, with blank dates at the top of the pile in a DataTable?

Here's part of my table. My actual table has much more data, but it's not relevant to this discussion. I am using the Twitter Bootstrap theme option.
[code]



Invoice
Date




CO406229



402553
Nov 06, 2012 9:11 AM


CO405120
Nov 05, 2012 8:11 PM


CO405139



CO400066
Nov 04, 2012 5:11 PM


CO402553
Nov 03, 2012 5:11 PM


\ CO405114
Nov 02, 2012 7:11 PM



[/code]

JQuery for the above table
[code]
$('#shipments').dataTable({
"sDom": "<'row'<'span6'<'dt_actions'>l><'span6'f>r>t<'row'<'span6'i><'span6'p>>",
"sPaginationType": "bootstrap_alt",
"oLanguage": {
"sLengthMenu": "_MENU_ records per page"
},
"iDisplayLength": 25,
"aaSorting": [[1, 'asc']]
});
[/code]

Replies

  • brilangbrilang Posts: 22Questions: 2Answers: 1
    Solved my own problem.

    I added a hidden column to my table, and put out the date in a recognized Javascript date format. Like this: November 06, 2013 11:30:48. I also told DataTables to recognize this column as a date for sorting purposes.

    Since I also control the data output on the server side, I modified blank dates to use a date in the future to keep the sorting in the desired order.

    Then I modified my JQuery as follows:
    [code]
    $('#shipments').dataTable({
    "sDom": "<'row'<'span6'<'dt_actions'>l><'span6'f>r>t<'row'<'span6'i><'span6'p>>",
    "sPaginationType": "bootstrap_alt",
    "oLanguage": {
    "sLengthMenu": "_MENU_ records per page"
    },
    "iDisplayLength": 25,
    "aoColumnDefs" : [
    { "aTargets": [ 2 ], "sType": "date", "bVisible": false },
    { "aTargets": [ 1 ], "iDataSort": 2 }
    ],
    "aaSorting": [ [ 1, "desc" ] ]
    });
    [/code]

    Hope this helps someone else...
This discussion has been closed.