DataTables: how to show only date, not date

Question

I use server-side processing according to the Django example in DataTables . I am returning datetime values ​​in this format "yyyy-mm-dd hh: mm: ss". These date time values ​​are currently displayed (for example):

December 18, 2011, 11:59 pm

I would like to display only the date, not the date and time.

This is what I have on my html page:

<script type="text/javascript"> /* <![CDATA[ */ $(document).ready(function() { $('#certs-table').dataTable({ "bJQueryUI": true, "sPaginationType": "full_numbers", "bProcessing": true, "bServerSide": true, "sAjaxSource": "/cars/get_cars_list/", "iDisplayLength": 10, "aoColumnDefs": [ { "aTargets": [0], "bVisible": false, "bSearchable": false}, { "aTargets": [1], "fnRender": function ( oObj ) { return '<a href=\"/cars/' + oObj.aData[0] + '/\">' + oObj.aData[1] + '</a>'; }, "bSearchable": true, }, { "aTargets": [2], "bSearchable": true}, { "aTargets": [3], "bSearchable": false, "sType": 'date'}, ] }); } ); /* ]]> */ </script> 

The date is the 4th column, i.e. aTarget [3].

How do I display only part of the date, please? I just started using DataTables / JQuery yesterday, so I would really like the example. Thanks.

Answer 1

I think the best option would be to convert the data server and just return the date format you want, but you can also

  { "aTargets": [3], "bSearchable": false, "sType": 'date', "fnRender": function ( oObj ) { var javascriptDate = new Date(oObj.aData[0]); javascriptDate = javascriptDate.getDate()+"/"+javascriptDate.getMonth()+"/"+javascriptDate.getFullYear(); return "<div class= date>"+javascriptDate+"<div>"; } } 

Answer 2

It is best to return the UTC date as a JSON string from the server, and then format it in a browser with the settings for the user's local format. I like to use moment.js for formatting. Example:

 "aoColumnDefs": [ { //format the date for local time "aTargets" : [ 1, 5], //indexes of whatever columns you need to format "mRender": function ( data, type, full ) { if(data){ var mDate = moment(data); return (mDate && mDate.isValid()) ? mDate.format("L LT") : ""; } return ""; } } ] 

There are different lines that you can return that will work with the moment. Make sure the offset (Z) is specified as +0000 , otherwise the date will be analyzed as local time.

 moment("2010-10-20 4:30"); // parsed as 4:30 local time moment("2010-10-20 4:30 +0000"); // parsed as 4:30 UTC 

Answer 3

Previous answers use the deprecated DataTables API. Syntax for versions 1.10+ :

 "columnDefs": [ { "targets": [6, 7], "type" : "date", "render": function (data) { if (data !== null) { var javascriptDate = new Date(data); javascriptDate = javascriptDate.getMonth() + 1 + "/" + javascriptDate.getDate() + "/" + javascriptDate.getFullYear(); return javascriptDate; } else { return ""; } } } ]