Datatable сортировка даты dd/mm / yyyy выпуск

сортировка даты-со скрытым элементом

преобразовать дату в формат YYYYMMDD и добавить к фактическому значению (ДД/ММ/ГГГГ) в <td>, оберните его в элемент, установите style display:none; элементов. Теперь сортировка даты будет работать как обычная сортировка. То же самое можно применить к сортировке по дате и времени.

HTML-код

<table id="data-table">
   <tr>
     <td><span>YYYYMMDD</span>DD/MM/YYYY</td>
   </tr>
</table>

в CSS

#data-table span {
    display:none; 
}

Я знаю, что это старый вопрос, и ответы тоже старые. Недавно я столкнулся с простым и чистым способом сортировки дат. Это можно сделать с помощью HTML5 до <td> элемент.

вот что я сделал в своем PHP:

<?php
$newdate = date('d M Y', $myDateTime); // Format in which I want to display
$dateOrder = date('Y-m-d', $myDateTime); // Sort Order
?>

<td data-order="<?php echo $dateOrder; ?>" >
<?php echo $newdate; ?>
</td>

попробовать этой плагин.

Как заявил здесь вы должны включить момент.js и плагин datatable-moment, а затем просто объявите формат даты, который вы используете. Плагин автоматически определит ваши столбцы даты и отсортирует их так, как должно быть. Для моментов.JS формат объяснения, проверьте здесь.

пример:

$(document).ready(function() {
    $.fn.dataTable.moment('DD/MM/YYYY HH:mm');
    $('#example').DataTable();
});

в php или js просто передайте массив и используйте ортогональный, например:

$var[0][0] = "like as u wish, 30/12/2015 or something else";
$var[0][1] = strtotime($your_date_variable);

и, в datatable...

$('#data-table-contas_pagar').dataTable({
    "columnDefs": [
        {"targets":[0],"data": [0],"render": {"_": [0],"sort": [1]}}
    ]
});

другое решение : https://datatables.net/blog/2014-12-18

С 2 javascripts libs : //cdnjs.cloudflare.com/ajax/libs/moment.js/2.8.4/moment.min.js и //cdn.datatables.net/plug-ins/1.10.15/sorting/datetime-moment.js

тогда только так :

$(документ).ready (function () {

$.fn.dataTable.moment( 'DD/MM/YYYY' );

$('#example').DataTable(); 

});

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

пример кода:

var date = new Date();
var millisecond = Date.parse(date);

HTML-код

<td>'<span style="display: none;">' + millisecond + "</span>" + date + </td>

вот именно.

решение Захира Ахмеда отлично работает, если вам нужно иметь дело с уже сформированной датой Великобритании.

У меня была проблема с этим решением, потому что мне пришлось управлять нами дата отформатированный.

Я понял это с помощью этого крошечного изменения:

function parseDate(a) {
    var ukDatea = a.split('/');
    return (ukDatea[2] + ukDatea[1] + ukDatea[0]) * 1;
}

jQuery.extend( jQuery.fn.dataTableExt.oSort, {
    "date-uk-pre": function ( a ) {
        return parseDate(a);
    },

    "date-uk-asc": function ( a, b ) {
        a = parseDate(a);
        b = parseDate(b);
        return ((a < b) ? -1 : ((a > b) ? 1 : 0));
    },

    "date-uk-desc": function ( a, b ) {
        a = parseDate(a);
        b = parseDate(b);
        return ((a < b) ? 1 : ((a > b) ? -1 : 0));
    }
});

с последующим определением "aoColumns".

Я пробовал это и работал на меня.

https://github.com/sedovsek/DataTables-EU-date-Plug-In

я использовал режим формат .ToString("dd/MM/yyyy"); затем в моем jQuery.Datatable работает отлично.

jQ ниже

oTable = $('#grid').dataTable({
    "sPaginationType": "full_numbers",
    "aoColumns": [
        { "sType": "eu_date" },
        null
    ]
});
});

столбец у вас есть даты, вы должны определить с помощью sType, как код выше.

Это решение абсолютно неверно. Вы не можете преобразовать дату в число, добавляя каждый компонент даты. Если вы попробуете эту логику, например, со следующими датами, вы увидите, что она не будет соответствовать правильно:

20/01/2014 = 2035 15/02/2014 = 2031

ведьма дата приходит сначала, по возрастанию? 20 января? Не по этой логике: P

правильно выполнения метода parsedate заключается в преобразовании строки в допустимое время datetime, и они используют функцию getTime для правильного заказа таблицы.

var day = a.split('/')[0]
var month = a.split('/')[1]
var year = a.split('/')[2]

var date = new Date(month + "/" + day + "/" + year)
return date.getTime()

Я хотел бы отметить, что при использовании данных с сервера через Ajax, решение супер простое, но может быть не сразу очевидно.

при возврате массива порядка сортировки Datatables отправит (в $_POST) массив из 2 элементов, который было бы эквивалентно в:

$_POST['order'][0] =array('column'=>'SortColumnName', 'dir'=>'asc'); 
// 2nd element is either 'asc' or 'desc'

таким образом, вы можете отображать дату в любом формате, который вы хотите; просто ваш сервер возвращает критерии сортировки, основанные только на sortColumnName.

например, в PHP (с MySQL) я использую следующее:

 if (isset($_POST['order'])) {
          switch ($_POST['order'][0]['column']) {
               case 0:// sort by Primary Key
                    $order = 'pkItemid';
                    break;
               case 1:// Sort by reference number
                    $order = 'refNo';
                    break;
               case 2://Date Started
                    $order = 'dOpen';
                    break;
               default :
                    $order = 'pkItemid';
          }
          $orderdir = ($_POST['order'][0]['dir'] === 'desc') ? 'desc' : 'asc';
     }

обратите внимание, что с тех пор ничего из $_POST перешло к $order или $orderdir, никакая кросс-скрипт атака не возможна.

теперь просто добавьте к запросу MySQL:

$sql ="SELECT pkItemid, refNo, DATE_FORMAT(dOpen,'%b %e, %Y') AS dateStarted
       FROM tblReference 
       ORDER BY $order $orderdir;";

запустите запрос и верните только dateStarted значение для Datatables в json.

использовать этот фрагмент!

$(document).ready(function() {
 $.fn.dataTable.moment = function ( format, locale ) {
    var types = $.fn.dataTable.ext.type;

    // Add type detection
    types.detect.unshift( function ( d ) {
        return moment( d, format, locale, true ).isValid() ?
            'moment-'+format :
            null;
    } );

    // Add sorting method - use an integer for the sorting
    types.order[ 'moment-'+format+'-pre' ] = function ( d ) {
        return moment( d, format, locale, true ).unix();
    };
};

$.fn.dataTable.moment('DD/MM/YYYY');

$('#example').DataTable();
});

момент js хорошо работает для всех форматов даты и времени, добавьте этот snipper перед инициализацией datatable, как я делал ранее.

также не забудьте загрузить http://momentjs.com/

У меня тоже такая же проблема.

Я использовал span с в td, как 03/21/2017, делая это, datatable рассматривал это как строку, и сортировка не работала.

Я удалил span внутри td, и он был исправлен. как, 03/21/2017

я использовал в вызове rest

* * переменная даты: Created**

var call = $.ajax({
            url: "../_api/Web/Lists/GetByTitle('NewUser')/items?$filter=(Created%20ge%20datetime'"+FromDate+"')%20and%20(Created%20le%20datetime'"+ToDate+"' and Title eq '"+epf+"' )&$top=5000",
            type: "GET",
            dataType: "json",
            headers: {
                Accept: "application/json;odata=verbose"
            }

            });

  call.done(function (data,textStatus, jqXHR){
        $('#example').dataTable({
            "bDestroy": true,
            "bProcessing": true,
            "aaData": data.d.results,
            "aLengthMenu" : [
             [50,100],
             [50,100]
            ],
             dom: 'Bfrtip',
            buttons: [
                'copy', 'csv', 'excel'
            ],

            "aoColumnDefs": [{ "bVisible": false  }],
            "aoColumns": [
                { "mData": "ID" },
                { "mData": "Title" },
                { "mData": "EmployeeName" },
                { "mData": "Department1" },
                { "mData": "ServicingAt" },
                { "mData": "TestField" }, 
                { "mData": "BranchCode" },   
                { "mData": "Created" ,"render": function (data, type, row) {
        data = moment(data).format('DD MMM YYYY');
        return data;
    }

самый простой способ разобраться в этой проблеме

просто измените свой дизайн немного, как это

//Add this data order attribute to td
<td data-order="@item.CreatedOn.ToUnixTimeStamp()">
                                    @item.CreatedOn
                                </td>
                                
                                
               
               Add create this Date Time helper function
// #region Region 
 public static long ToUnixTimeStamp(this DateTime dateTime) {
 TimeSpan timeSpan = (dateTime - new DateTime(1970, 1, 1, 0, 0, 0));
     return (long)timeSpan.TotalSeconds;
     } 
     #endregion

пожалуйста, посмотрите это официальное решение DataTable, используя момент.js:

конечная дата / время сортировки плагин

https://datatables.net/blog/2014-12-18

что, кажется, работает для меня

нажмите полный объект datetime, извлеченный с помощью запроса select из моей БД в наборе данных, который будет отображаться в формате datatable "2018-01-05 08:45:56"

затем

    $('#Table').DataTable({
        data: dataset,
        deferRender: 200,
        destroy: true,
        scrollY: false,
        scrollCollapse: true,
        scroller: true,
        "order": [[2, "desc"]],
        'columnDefs': [
            {
                'targets': 2,
                'createdCell':  function (td, cellData, rowData, row, col) {                        
                    var datestamp = new Date(cellData);
                    $(td).html(datestamp.getUTCDate() + '-' + (datestamp.getMonth()+1) + '-' + datestamp.getFullYear());
                }
            }
        ],
        "initComplete": function(settings, json) {
            $($.fn.dataTable.tables(true)).DataTable()
                .columns.adjust();               
        }
    });

строки сортируются правильно, затем я получаю html, который я хочу в строке

поскольку я нашел самый простой способ сортировки в этом случае, добавив опцию "aaSorting" в JS.

например:

$(document).ready(function() {
    $('#contacts-table').dataTable({
        "aaSorting": [0, 'desc']
});

проблема здесь в том, что этот пример будет сортировать записи из 1-го столбца, как строка, но не как даты. Если исходный код позволяет изменить формат даты с dd/mm/yyyy на yyyy/mm / dd, "aaSorting" будет работать правильно для вас.

использовать на <td> тег вот так (Пример Рубин):

    <td data order='<%=rentroll.decorate.date%>'><%=rentroll.decorate.date%></td>

ваша функция декоратора здесь будет:

    def date
    object.date&.strftime("%d/%m/%Y")
    end

Если вы получаете свои даты из базы данных и делаете цикл for для каждой строки и добавляете его в строку для использования в javascript для автоматического заполнения datatables, это должно выглядеть так. Обратите внимание, что при использовании скрытого трюка span вам нужно учитывать однозначные номера даты, например, если это 6-й час, вам нужно добавить ноль перед ним, иначе трюк span не работает в сортировке.. Пример кода:

 DateTime getDate2 = Convert.ToDateTime(row["date"]);
 var hour = getDate2.Hour.ToString();
 if (hour.Length == 1)
 {
 hour = "0" + hour;
 }
 var minutes = getDate2.Minute.ToString();
 if (minutes.Length == 1)
 {
 minutes = "0" + minutes;
 }
 var year = getDate2.Year.ToString();
 var month = getDate2.Month.ToString();
 if (month.Length == 1)
 {
 month = "0" + month;
 }
 var day = getDate2.Day.ToString();
 if (day.Length == 1)
 {
 day = "0" + day;
 }
 var dateForSorting = year + month + day + hour + minutes; 
 dataFromDatabase.Append("<span style=\u0022display:none;\u0022>" + dateForSorting +
 </span>");