数据表日期排序DD / MM / YYYY问题(Datatable date sorting dd/

2019-06-17 18:15发布

我使用的是jQuery插件称为数据表

它太棒了,但我不能得到的日期根据DD / MM / YYYY格式正确排序。

我已经看过他们的支持的格式,但没有这些修补程序似乎工作。

在这里任何人都可以帮我吗?

Answer 1:

jQuery的解决方案

这里是工作的jQuery的解决方案 。

jQuery.extend( jQuery.fn.dataTableExt.oSort, {
"date-uk-pre": function ( a ) {
    var ukDatea = a.split('/');
    return (ukDatea[2] + ukDatea[1] + ukDatea[0]) * 1;
},

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

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

上面的代码添加到脚本,并设置与日期值的特定列{ "sType": "date-uk" }等为空,见下图:

$(document).ready(function() {
    $('#example').dataTable( {
        "aoColumns": [
            null,
            null,
            null,
            null,
            { "sType": "date-uk" },
            null
        ]
    });
    });

CSS解决方案

如果你想有一个快速的解决方案,你可以只是追加每行的实际日期时间值的特定格式(年月日),并隐藏它使用CSS,它可以让你在没有任何JavaScript改变栏排序。

这里是工作的CSS解决方案

HTML

<td><span class='hide'>YYYYMMDD</span>DD/MM/YYYY</td>

CSS

.hide {
    display:none; 
}


Answer 2:

日期排序 - 有一个隐藏的元素

转换的时间,以在格式YYYYMMDD和前置的实际值(DD / MM / YYYY) <td>式中的元件,设置样式包装它display:none; 的元素。 现在日期排序将作为一个正常的排序。 这同样可以应用到日期时间排序。

HTML

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

CSS

#data-table span {
    display:none; 
}


Answer 3:

我知道这是一个老问题和答案都老了。 最近我碰到整理日期的简单和干净的方式。 它可以通过HTML5来完成data-order属性<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>


Answer 4:

试试这个插件。

如前所述这里你需要包括Moment.js和数据表中矩的插件,然后就宣布要使用的日期格式。 该插件将自动检测您的日期列和排序它喜欢它应该是。 对于moment.js格式的说明,请点击这里 。

例:

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


Answer 5:

另一个解决方法: https://datatables.net/blog/2014-12-18

用2周的javascripts库://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

那么只有这个:

$(文件)。就绪(函数(){

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

});



Answer 6:

在PHP或JS只是传递数组,并使用正交,如:

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

并且,在数据表...

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


Answer 7:

如果你不希望使用momentum.js或任何其他日期格式化,你可以在日期值前面加上以毫秒为单位的日期格式,以便排序将根据它的毫秒读取。 和隐藏毫秒的日期格式。

示例代码:

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

HTML

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

而已。



Answer 8:

如果你要处理英国已经格式化日期查希尔·艾哈迈德”的解决方案正常工作。

我有一个问题,这个解决方案,因为我不得不来管理美国格式化日期。

我想通了这个微小的变化:

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”的定义。



Answer 9:

我想这对我的工作。

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

你有日期列,你应该像上面的代码中的S型定义。



Answer 10:

该解决方案是完全错误的。 你不能一个日期转换为数字只需添加日期的每个组成部分。 如果您尝试这个逻辑,例如用下面的日期,你会看到它不会正确地匹配:

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

女巫日期至上,升? 一月20? 不按照这个逻辑:P

做parsedate方法的正确方法是将字符串转换为有效的日期时间,以及他们使用的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()


Answer 11:

我想指出的是,从通过Ajax服务器使用数据时,解决的办法是超级简单,但可能不会立即明显。

当返回的排序顺序排列,数据表将发送(中$_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以JSON值数据表。



Answer 12:

使用这个片段!

$(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可以很好地用于所有的日期和时间格式的那一刻,你初始化数据表之前,像我前面做的添加此剪断。

还记得加载http://momentjs.com/



Answer 13:

我也得到了同样的问题。

我在使用TD跨度像2017年3月21日,通过这样做,数据表处理这个string和排序没有工作。

我删除跨​​度内TD,并得到固定。 像,2017年3月21日



Answer 14:

我在其他调用中使用

**日期变量是:创建**

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


Answer 15:

最简单的方法来解决这个问题

只需要修改你这样的设计有点

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



Answer 16:

请看看这个官方数据表”的解决方案,使用Moment.js:

最终的日期/时间排序插件

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



Answer 17:

有什么事对我来说是工作

推动从我的数据集中至极分贝选择查询获取完整的日期时间对象将是数据表格式“2018年1月5日8点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我想要的行



Answer 18:

因为我发现最简单的方法在这种情况下,排序是通过添加“aaSorting”在JS选项。

例如:

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

这里的问题是,这个例子将整理来自像串1-ST列项,但不喜欢日期。 如果源代码可以让你改变从DD / MM / YYYY以YYYY / MM / DD日期格式“aaSorting”将正确地为你工作。



Answer 19:

使用data-order的属性<td>像这样( 红宝石实施例 )标签:

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

在这里你的装饰功能是:

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


Answer 20:

如果从数据库中获取您的日期,并做一个for循环的每一行,并将其添加到一个字符串在JavaScript中使用,自动将填充数据表,它需要这个样子。 注意,使用隐藏的范围招时,你需要像如果第6小时,你需要在前面加一个零,否则跨度伎俩不会在分拣作业中占的日期的个位数。例的代码:

 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>");


Answer 21:

试试这个:

"aoColumns": [
        null,
        null,
        null,
        null,
        {"sType": "date"},  //  "sType": "date" TO SPECIFY SORTING IS APPLICABLE ON DATE
        null
      ]


Answer 22:

要列你想订购保持“S型”:“日期-英国”,例如: - "data": "OrderDate", "sType": "date-uk"的DataTable脚本在阿贾克斯结束后继续下面的代码

 jQuery.extend(jQuery.fn.dataTableExt.oSort, {
            "date-uk-pre": function (a) {
                var ukDatea = a.split('/');
                return (ukDatea[2] + ukDatea[1] + ukDatea[0]) * 1;
            },

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

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

然后你会在这种格式获取日期为22-10-2018



Answer 23:

问题源是日期时间格式。

错样品: “MM-DD-YYYY H:MM”, “MM-DD-YYYY”

正确的样品: “MM-DD-YYYY HH:MM”



Answer 24:

该simpliest方法是在列的每一个TD标记日期前加一个隐藏的时间戳,例如:

<td class="sorting_1">
    <span class="d-none">1547022615</span>09/01/2019  09:30
</td>

使用默认字符串排序,时间戳会命令列你想要的方式,并在浏览器中呈现时,它不会显示。



Answer 25:

你可以用PHP解决此问题。

$mydate = strtotime($startdate);
$newformat = date('d-m-Y',$mydate);
echo '<tr>';
echo '  <td data-sort="'. $mydate .'">'.$newformat .'</td>';


文章来源: Datatable date sorting dd/mm/yyyy issue