Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
1.5k views
in Technique[技术] by (71.8m points)

jquery - datatable sorting on string as number

i have datatable and i want to sort in as numeric it contains value like 1st,2nd...., here is my code when i sort it it sorts values like 1st,10th,2nd so on how to sort it properly?

$('#example').DataTable( {
   //      "columnDefs": [
   //   { "visible": false, "targets": 4 }
   // ],
"aaSorting": [[1,'asc']],
   "columnDefs": [ {
    "targets": [2,5,6],
    "orderable": false
  } ,
  {
    "targets": 0,
    "orderable": false
  },
  { "width": "5%", "targets": 0 },
  { "width": "8%", "targets": 1 }],

  initComplete: function () {

    this.api().columns().every( function () {
      var column = this;
      var select = $('<select><option value=""></option></select>')
      .appendTo( $(column.footer()).empty() )
      .on( 'change', function () {
        var val = $.fn.dataTable.util.escapeRegex(
         $(this).val()
         );

        column
        .search( val ? '^'+val+'$' : '', true, false )
        .draw();
      } );

      column.data().unique().sort().each( function ( d, j ) {
        select.append( '<option value="'+d+'">'+d+'</option>' )
      } );
    } );
  }
}); 
See Question&Answers more detail:os

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Answer

0 votes
by (71.8m points)

I suggest using orthogonal data&HTML 5 in DataTable. It is simple and good solution.

It is simple solution, because it doesn't needs any configuration change or additional coding.

And it is good solution, because it separates sorting values from data representation. So you can show anything to user and sort by values as you would like to.

In each td element there should be data-order attribute. For an example:

<td data-order="3120">$3,120/m</td>

More about this https://datatables.net/manual/data/orthogonal-data


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...