DataTable:在td内的日期自定义排序

时间:2017-01-13 07:10:09

标签: javascript jquery html sorting datatables

我有一个JQuery DataTable并且它运行良好但是在特定列上排序不能正常工作。

在该列中有一些不同类型的值,如日期数字文字,如下所示:

enter image description here

我想在日期字段上实现自定义排序。

有没有伙伴知道如何实现?

有没有办法对<span>中的特定<td>代码应用自定义排序。我可以在日期周围应用<span>标记。

以另一种方式实现这种类型的排序。

我读了太多文章但没有找到任何帮助。

任何帮助都将不胜感激。

谢谢。

1 个答案:

答案 0 :(得分:0)

尝试这种方法:

$("#example").DataTable({
    columns:[
        null, 
        null, 
        null, 
        null,
        {
            "render": function(d){
                return $("<span></span>",{
                    "text": d,
                    "data-date": d.match(/[0-9]{2}[\/][0-9]{2}[\/][0-9]{4}$/)[0]
                }).prop("outerHTML");
            },
            "type": "data-date"
        }, 
        null
    ]
});

jQuery.extend(jQuery.fn.dataTableExt.oSort, {
    "data-date-pre": function(a) {
        return parseInt(moment($(a).data("date"), "DD/MM/YYYY").format("X"), 10);
    },
    "data-date-asc": function(a, b) {
        return ((a < b) ? -1 : ((a > b) ? 1 : 0));
    },
    "data-date-desc": function(a, b) {
        return ((a < b) ? 1 : ((a > b) ? -1 : 0));
    }
});

基本上,我们将相关数据包装在一个范围内,并提取日期并添加为数据属性。然后我们对此进行排序。希望有所帮助。使用类似数据工作JSFiddle