Odering icon missing

Andreas S.

I have implemented datatables in wordpress. The Table are shown, but the icon to chance the ordering are missing. I have no idea why.
The JS Script:

jQuery( document ).ready( function() {
  var ajaxurl = '/wp-content/plugins/finswim-cup-tools/admin/fsct-server-processing.php?cy=' + php_vars.cy;

  jQuery( '#fsct_admin_rank_table' ).DataTable( {
    dom: "<'row'<'col-sm-4'l><'col-sm-4 DT_Buttons_Style'B><'col-sm-4'f>>rt<'row'<'col-sm-6'i><'col-sm-6'p>>",
        ajax: {
            url: ajaxurl,
            type: 'POST'
    },
    columnDefs: [
      { targets: 0, orderable: true },
      { targets: 1, visible: true, searchable: true, orderable: true },
      { targets: 2, visible: true, searchable: true, orderable: true }
      { targets: '_all', searchable: false, orderable: false }
    ],
    order: [ [ 0, 'asc' ] ],
    processing: true,
        serverSide: true,
        columns: [
            { data: 'athlete.lastname', width: '25%' },
            { data: 'athlete.firstname', width: '20%' },
            { data: 'agegroup', width: '4%', className: 'text-center' },
      { data: 'agrd1', render: function( data, type, row ){
        if(type === 'display'){
          return ( data == 0 ) ? '' : data;
        } }, className: 'text-center'
      },
      { data: 'agrd2', render: function( data, type, row ){
        if(type === 'display'){
          return ( data == 0 ) ? '' : data;
        } }, className: 'text-center'
      },
      { data: 'agrd3', render: function( data, type, row ){
        if(type === 'display'){
          return ( data == 0 ) ? '' : data;
        } }, className: 'text-center'
      },
      { data: 'agrd4', render: function( data, type, row ){
        if(type === 'display'){
          return ( data == 0 ) ? '' : data;
        } }, className: 'text-center'
      },
      { data: 'agrd5', render: function( data, type, row ){
        if(type === 'display'){
          return ( data == 0 ) ? '' : data;
        } }, className: 'text-center'
      },
            { data: 'agtotal', width: '5%', className: 'text-center' },
      { data: 'agrd1', render: function( data, type, row ){
        if(type === 'display'){
          return ( data == 0 ) ? '' : data;
        } }, className: 'text-center'
      },
      { data: 'agrd2', render: function( data, type, row ){
        if(type === 'display'){
          return ( data == 0 ) ? '' : data;
        } }, className: 'text-center'
      },
      { data: 'agrd3', render: function( data, type, row ){
        if(type === 'display'){
          return ( data == 0 ) ? '' : data;
        } }, className: 'text-center'
      },
      { data: 'agrd4', render: function( data, type, row ){
        if(type === 'display'){
          return ( data == 0 ) ? '' : data;
        } }, className: 'text-center'
      },
      { data: 'agrd5', render: function( data, type, row ){
        if(type === 'display'){
          return ( data == 0 ) ? '' : data;
        } }, className: 'text-center'
      },
            { data: 'agtotal', width: '5%', className: 'text-center' }
    ],
    select: true,
    ordering: false,
    autoWidth: false,
    buttons: [
      {
                extend: "pdfHtml5",
                text: '<i class="fa fa-file-pdf-o text-red"></i>',
                titleAttr: 'Export to PDF',
      }
    ]
  } );
} );

There is no possible way to send a ordering. The $_POST for column 0 looks like this:

   columns[0][data]: athlete.lastname
   columns[0][name]: 
   columns[0][orderable]: false
   columns[0][search][regex]: false
   columns[0][search][value]: 
   columns[0][searchable]: true

Anyone a idea where my fault is?

kthorngren

You are missing a comma causing the script to stop. Should be a error in your browser's console.

    columnDefs: [
      { targets: 0, orderable: true },
      { targets: 1, visible: true, searchable: true, orderable: true },
      { targets: 2, visible: true, searchable: true, orderable: true }   <<<<missing comma
      { targets: '_all', searchable: false, orderable: false }
    ],

Kevin

Andreas S.

Thanks, I see this missing comma, after sending my question. But to set this comma did not solve my Problem

Andreas

kthorngren

Didn't see it earlier but you have:
ordering: false,

This will disable ordering for the whole table. Try removing it to see if you have the results you want.

Kevin

Andreas S.

Thanks, yes, that was my fault. Read the code 100 times and see not this line. Thanks