DataTables, как мне показать только дату, а не дату и время

Я использую обработку на стороне сервера в соответствии с примером Django в Таблицы данных. Я возвращаю значения даты и времени в этом формате «гггг-мм-дд чч: мм: сс». Эти значения даты и времени в настоящее время отображаются следующим образом (например):

18 декабря 2011 г., 23:59

Я хотел бы отображать только часть даты, а не дату и время.

Это то, что у меня есть на моей html-странице:

<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>

Дата — это 4-й столбец, т. е. aTarget[3].

Как отобразить только часть даты, пожалуйста? Я только вчера начал использовать DataTables/JQuery, поэтому был бы очень признателен за пример. Спасибо.


person half_full    schedule 11.07.2011    source источник


Ответы (3)


Я думаю, что лучше всего было бы преобразовать сторону сервера данных и просто вернуть нужный формат даты, но вы также можете

 { "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>";
              }
 }
person Nicola Peluchetti    schedule 12.07.2011
comment
на самом деле не полный ответ, так как getMonth возвращает индекс, основанный на нуле, поэтому Jan = 0, но дает основу для подключения в вашем собственном форматировании ===================== ===== Метод getMonth() возвращает месяц (от 0 до 11) указанной даты по местному времени. Примечание. Январь равен 0, февраль равен 1 и так далее. - person dave heywood; 11.02.2013

Часто лучше всего вернуть дату в формате UTC в виде строки JSON с сервера, а затем отформатировать ее в браузере с настройками локального формата пользователя. Мне нравится использовать moment.js для форматирования. Пример:

"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 "";
        }
    }
]

Есть разные строки, которые вы можете вернуть, которые будут работать с моментом. Убедитесь, что вы указали смещение (Z) как +0000, иначе дата будет проанализирована как местное время.

moment("2010-10-20 4:30"); // parsed as 4:30 local time
moment("2010-10-20 4:30 +0000"); // parsed as 4:30 UTC 
person Alex    schedule 20.09.2013
comment
Привет у меня аналогичная проблема. Я использовал ваш код, и он не работает? Я только что скопировал ваш код, за исключением формата даты, который я изменил на «дд-мм-гггг». Надеюсь, он должен работать, но это не так. Можете ли вы дать какое-либо предложение? - person Ghost Rider; 09.01.2016

В предыдущих ответах используется устаревший API DataTables. синтаксис для версий 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 "";
            }
        }
    }
]   
person devlin carnate    schedule 18.07.2016