Sort by number with Datatables

Asked

Viewed 814 times

3

I’m having a problem with the plugin DataTables in order of numbers. I have a list of numbers:

1
2
3
4
...
10
11
12

The problem happens because of the digits. It sorts type

1
10
11
12
2
3
4
...

The correct order would be from 1 to 12, but because you don’t have the 0 in front of the numbers with 1 digit it orders wrong. There is some way to fix this in this plugin ?

Script

var table = $('#sample_1');

        /* Table tools samples: https://www.datatables.net/release-datatables/extras/TableTools/ */

        /* Set tabletools buttons and button container */


        $.extend(true, $.fn.DataTable.TableTools.classes, {
            "container": "btn-group tabletools-dropdown-on-portlet",
            "buttons": {
                "normal": "btn btn-sm default",
                "disabled": "btn btn-sm default disabled"
            },
            "collection": {
                "container": "DTTT_dropdown dropdown-menu tabletools-dropdown-menu"
            }
        });

        var oTable = 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": "Nenhum registro encontrado",
                "info": "Mostrando _START_ de _END_ de um total de _TOTAL_ registros",
                "infoEmpty": "Nenhum registro encontrado",
                "infoFiltered": "Nenhum registro encontrado (pesquisado em _MAX_ registros)",
                "lengthMenu": "Mostrar _MENU_ registros",
                "search": "Pesquisar:",
                "zeroRecords": "Nenhum registro encontrado com os termos digitados"
            },

            "order": [
                [0, 'desc']
            ],

            "lengthMenu": [
                [5, 15, 20, -1],
                [5, 15, 20, "Todos"] // change per page values here
            ],

            // set the initial value
            "pageLength": 10,

            "dom": "<'row' <'col-md-12'T>><'row'<'col-md-6 col-sm-12'l><'col-md-6 col-sm-12'f>r><'table-scrollable't><'row'<'col-md-5 col-sm-12'i><'col-md-7 col-sm-12'p>>", // horizobtal scrollable datatable

            // Uncomment below line("dom" parameter) to fix the dropdown overflow issue in the datatable cells. The default datatable layout
            // setup uses scrollable div(table-scrollable) with overflow:auto to enable vertical scroll(see: assets/global/plugins/datatables/plugins/bootstrap/dataTables.bootstrap.js).
            // So when dropdowns used the scrollable div should be removed.
            //"dom": "<'row' <'col-md-12'T>><'row'<'col-md-6 col-sm-12'l><'col-md-6 col-sm-12'f>r>t<'row'<'col-md-5 col-sm-12'i><'col-md-7 col-sm-12'p>>",

            "tableTools": {
                "sSwfPath": "../../assets/global/plugins/datatables/extensions/TableTools/swf/copy_csv_xls_pdf.swf",
                "aButtons": [{
                    "sExtends": "print",
                    "sButtonText": "Imprimir",
                    "sInfo": 'Pressione "CTR+P" para imprimir ou "ESC" para sair',
                    "sMessage": "Gerado por DataTables"
                }]
            }
        });

        var tableWrapper = $('#sample_1_wrapper'); // datatable creates the table wrapper by adding with id {your_table_jd}_wrapper

        tableWrapper.find('.dataTables_length select').select2(); // initialize select2 dropdown
  • How is your datatables code? Add it there in the question.

  • @Diegofelipe edited

1 answer

2

Try to add that to your dataTable

aoColumns: [{
    sSortDataType: 'dom-text',
    sType: 'numeric'
},
null]

But before he puts this:

$.fn.dataTableExt.afnSortData['dom-text'] = function (oSettings, iColumn) {
        var aData = [];
        oSettings.oApi._fnGetTrNodes(oSettings).forEach(function (nRow) {
        var oElem = $('td:eq(' + iColumn + ') input', nRow);
        aData.push(oElem.val());
     });
    return aData;
};

I don’t work a lot with dataTables, but I’ve had a similar problem with you and that’s solved.

Browser other questions tagged

You are not signed in. Login or sign up in order to post.