sorting on date not working (ddd DD-MM-YYYY)

karlienfabre

Link to test case: https://live.datatables.net/gokabuxi/2/
Debugger code (debug.datatables.net): https://debug.datatables.net/izuyuc
Error messages shown: /
Description of problem: sorting on date isn't working.

I can't figure out why my table isn't sorting correctly on date. (eg. on page 2-3 of the table, there's again rows which contains date earlier than the latest rows in the first page of the table.).

I've tried to follow this link https://datatables.net/blog/2014-12-18 by adding:

$.fn.dataTable.moment("ddd DD-MM-YYYY", "nl-be");

My full code is in the test case, I do think I'm doing something wrong in the part where I init the table? (so I've left out some code of the function that seems irrelevant to me, but full function available in the testcase).

function builtRacesTable(races, filters){

    $.fn.dataTable.moment("ddd DD-MM-YYYY", "nl-be");

    var table = $("#racesTable").DataTable({
        data: uniqueRaces,
        columnDefs: [
            // here 1 is the column index for 2nd column
            { type: 'date', targets: 1 }
        ],
        columns: [
            {
                className: "details-control",
                orderable: false,
                data: null,
                defaultContent: '<i class="fa-solid fa-circle-info"></i>'
            },
            { data: "displayDate"},
            { data: "searchDate", visible: false},
            { data: "wedstrijd"},
            { data: "type" },
            { data: "afstand" },
            { data: "atheletsHTML"},
            { data: "athletes_list", visible: false }
        ],
        order: [[1, 'asc']],
        processing: true,
        language: {
            url: '//cdn.datatables.net/plug-ins/1.13.4/i18n/nl-NL.json', 
            "processing": '<div class="d-flex justify-content-center"><div class="spinner-border" role="status"><span class="visually-hidden">Loading...</span></div></div>'
        },
        "pageLength": 15,
        //"bFilter": false,
        "responsive": false,
        "bLengthChange": false
    });

}

Thanks in advance!
Karlien

kthorngren

Your dates look like this:

zo. 25-02-2024
vr. 20-09-2024

The moment format you specify doesn't match:

ddd DD-MM-YYYY

The moment docs show ddd as representing Sun Mon ... Fri Sat strings.

I'm not sure what the letters like zo. or vr. represent nor if they are expected to affect sorting. I'm not sure how to specify those strings with moment formatting.

Your test case uses columns.type to set the Datum column to type date. Its not recommended to do this since Datatables performs type detection for all columns.

I commented out the columns.type setting and used the moment format DD-MM-YYYY to match the string without the leading characters. Then used columns.render to remove the leading characters for sorting and type detection processes. See the Orthogonal data docs for more details.

Is this what you are looking for?
https://live.datatables.net/kakotelu/1/edit

Kevin

karlienfabre

Hi Kevin,

Thanks for the solution, adding the render function for that cell and changing the format does the trick.

What I can't understand is that the dates in format vr. 20-09-2024 are also created by using moment:

var displayDateMoment = moment(date).format('ddd DD-MM-YYYY');

so

$.fn.dataTable.moment("ddd DD-MM-YYYY", "nl-be");

should work 'in theory'. But maybe a limitation of the moment/datetime/datatables plugin.

Thanks a lot for the help!