Search code examples
sortinghtml-tabledatatablegrid

Datatable Number, letters and special Characters Sorting not working


enter image description here

How can I sort data table with Numbers and letters along with special characters?

$("#leader_board_table").DataTable({
        // Internationalisation. For more info refer to http://datatables.net/manual/i18n
        "language": {
            "aria": {
                "sortAscending": ": activate to sort column ascending",
                "sortDescending": ": activate to sort column descending"
            },
            "emptyTable": "Start buying to build your portfolio first!",
            "info": "Showing _START_ to _END_ of _TOTAL_ entries",
            "infoEmpty": "No entries found",
            "infoFiltered": "(filtered1 from _MAX_ total entries)",
            "lengthMenu": "_MENU_ entries",
            "search": "Search:",
            "zeroRecords": "No matching records found"
        },

        
        //"columnDefs": coldefs,
        "lengthMenu": [
            [5, 10, 15, 30, -1],
            [5, 10, 15, 30, "All"] // change per page values here
        ],
        // set the initial value
        "pageLength": 10,
        "searching": false,
        "ordering": true,
        "paging": true,
        "bLengthChange": false,
        "bPaginate": true,
        "autoWidth": false,
        "deferRender": false,
        "bInfo": false,
    });

https://jsfiddle.net/vak6gzmd/3/

I have attached the URL of my sample grid.


Solution

  • I found a solution. I used columns.render to return the value you wish to sort by - see the example I posted before. In your case, you would strip out the HTML, and just return the numeric part of the data - I've done the two PKR columns for you here as a [guide],

    columnDefs: [{
            targets: [2, 3],
            render: function(data, type) {
            if (type === 'sort' || type === 'type') {
            var d = data.split(' ')[4].replace(/,/g,"")
            console.log(d)
            return d;
            }
            return data
            }
            }]