How to sort date column in datatable? after sorting the dates are coming like this 31-12-2022, 31-12

Sidhant

GetData= () => {
$.ajax({
type: "GET",
url: apiurl + "/Api/getdata",
dataType: "json",
success: function (data) {

         if (data == null) {
             toastr.warning("No Data Available", 'Mobilize Equipment Details', Toastroptions);
         }
         else {
             $("#addMobilizediv").slideDown('slow');

             if ($.fn.DataTable.isDataTable('#tblMobilize')) {
                 $('#tblMobilize').DataTable().destroy();
                 $('#tblMobilize tblMobilizebody').empty();

             }

             table = $('#tblMobilize').DataTable({

                 "lengthMenu": [[5, 10, 25, 50], [5, 10, 25, 50]],

                 "scrollX": true,

                 "pageLength": 5,
                 language: {
                     searchPlaceholder: "Search records",
                 },
                 "sPaginationType": "full",

                 "searchHighlight": true,
                 "language": {
                     "paginate": {
                         "previous": '<i class="fa fa-backward PMS-Pagination" title="Previous"></i>',
                         "next": '<i class="fa fa fa-forward PMS-Pagination" title="Next"></i>',
                         "first": '<i class="fa fa-fast-backward PMS-Pagination" title="First"></i>',
                         "last": '<i class="fa fa-fast-forward PMS-Pagination" title="Last"></i>',
                     }
                 },

                 data: data,
                 columns: [
                     {
                         'sortable': false,
                         'searchable': false,
                         'mRender': (data, type, row) => {

                             let option = '<span><a onclick="EditMobilize(' + row.Id + ')" title="Edit Mobilize Equipment" class="mr-2 editbtn"> <i class="fa fa-edit text-secondary editicon"></i></a> </span>' +
                                 '<span><a onclick="DeleteMobilize(' + row.Id + ')" title="Delete Mobilize Equipment" class="mr-2 deletebtn"> <i class="fa fa-trash text-secondary deleteicon"></i></a> </span>' +
                                 '<span><a onclick="DemobilizationDate(' + row.Id + ')" title="Demobilize Equipment" class="mr-2 demobilizebtn"><i class="fa fa-upload demobileicon"></i></a> </span>';
                             return option;

                         }
                     },
                     { 'data': 'EquipmentNo' },

                     {

                         'sortable': false,
                         'searchable': false,
                         'data': 'EquipmentType.Name'
                     },

                     {
                         'sortable': false,
                         'searchable': false,
                         'data': 'Cost'
                     },

                     {
                         'mRender': (data, type, row) => {
                             //return '<span>' + row.MobilizationDate.split('T')[0] + '</span>';
                             return moment(row.MobilizationDate).format('DD-MM-YYYY');
                         }
                     },

                     {
                         'sortable': false,
                         'searchable': false,
                         'mRender': (data, type, row) => {
                             let option = (row.isDeMobilized == true) ? '<span><i class="fas fa-check check"></i></span>' : '<span><i class="fa fa-times cross"></i></span>';
                             return option;
                         }
                     },

                     {
                         'mRender': (data, type, row) => {
                             if (row.DeMobilizationDate != null) {

                                 return '<span>' + row.DeMobilizationDate.split('T')[0] + '</span>';
                             }
                             else {
                                 return null;
                             }
                         }
                     }

                 ],
                 order: [[4, 'asc']],
                 'columnDefs': [
                     {
                         orderable: false,
                         "targets": 0,
                         "className": "text-center",
                     },
                     {
                         "targets": 1,
                         "className": "text-center",
                     },
                     {
                         "targets": 2,
                         "className": "text-center",
                     },
                     {
                         "targets": 3,
                         "className": "text-center",
                     },
                     {
                         "targets": 4,
                         "className": "text-center",
                         //"type": 'date-dd-mmm-yyyy'
                        /* here i have tried to solve the problem but after sorting the dates are coming like this 31-12-2022, 31-12-2021, 31-03-2020, 29-04-2022, 25-05-2022,25-01-2023, 24-02-2023, 15-02-2023, 14-03-2023 .the dates are not sorting properly*/

                         "type": 'date-eu'   

                     },
                     {
                         "targets": 5,
                         "className": "text-center",
                     },
                     {
                         "targets": 6,
                         "className": "text-center",
                     },
                 ],
                 //sort: true,
                 "fnDrawCallback": function () {
                     authorization();
                 },
             });

         }
         $($.fn.dataTable.tables(true)).DataTable()
             .columns.adjust();
     },
     error: function (xhr) {

         toastr.error(xhr.statusText, 'Mobilize Equipment Details', Toastroptions);

     }
 });

}

allan

Thanks for your question. As noted in the forum rules, please post a link to a running test case showing the issue so we can offer some help. Information on how to create a test case (if you aren't able to link to the page you are working on) is available here.

Allan