jQuery DataTable Show entries, Search box and sort not working?

Question

I have an issues with datatable show entries 、sorting and filter basically all the JS function not working. I've already include the JS files. some details:my DataTables is server-side processing and retrieve data in json from serverside .

datatable.php

<script type="text/javascript" charset="utf8" src="//code.jquery.com/jquery-1.12.3.js"></script>
<script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/1.10.12/js/jquery.dataTables.min.js"></script>
<script>
$(document).ready(function() {   
 $.fn.dataTable.ext.errMode = 'none';
   var table = $('#example').DataTable( {
    "processing": true,
    "serverSide": true,
    "jQueryUI": true,
     "ordering": true,
     "searching": true,
     "order": [[1, 'desc']],//set column 1 (time)
      "ajax": {
       url: "process.php",
       type: 'POST',
       data: {
       from: "<?php echo $from; ?>",
       to: "<?php echo $to; ?>"
          }
       },    
    "columns": [
        {
            "className":'details-control',
            "orderable":false,
            "data":null,
            "defaultContent": ''
        },
        { "data": "time"},
         { "data": "message", 
            "render": function ( data, type, row )
              {
                  data = data.replace(/&/g, "&amp;").replace(/>/g, "&gt;").replace(/</g, "&lt;").replace(/"/g, "&quot;");
                  return type === 'display' && data.length > 200 ?
                 '<span title="'+data+'">'+data.substr( 0, 98 )+'...</span>' :data;
               }
          }

    ]

} );

// Add event listener for opening and closing details
$('#example tbody').on('click', 'td.details-control', function () {
    var tr = $(this).closest('tr');
    var row = table.row( tr );       
    if ( row.child.isShown() ) {
        // This row is already open - close it
        row.child.hide();
        tr.removeClass('shown');
    }
    else {
        // Open this row
        row.child( format( row.data())).show();
        tr.addClass('shown');
     }
  } );
} );
</script>
 <body>
   <table id="example" class="display" cellspacing="0" width="100%">
   <thead>
       <tr>
          <th ></th>
           <th data-search-index="3">time</th>
           <th data-search-index="3">Message</th>
           </tr>
    </thead>
              <tfoot>
                <tr>
                  <th></th>
                  <th>time</th>
                  <th>Message</th>
                </tr>
              </tfoot>
            </table>
</body>

process.php

 $search='';
 $requestData= $_REQUEST;
 if(isset($_POST["search"]["value"]) && !empty($_POST["search"]["value"])){
 $search ='&q=_all:'.$_POST["search"]["value"];
 }
$qryurl ='<ip>/log/_search?size=10'.$search  ;

    if ( !empty($requestData['start']) && $requestData['length'] != '-1' )
    {

        $qryurl ='<ip>/log/_search?size=10&from='.$requestData['start'].$search; 
    }
 .......
 //json output 
 $results = array(
   "draw"  => intval($requestData['draw']),
    "iTotalRecords" =>intval($total),
      "iTotalDisplayRecords" => intval($total),
     "aaData"=>$sourceary
    );

now I can see the table but I just can't sorting or searching and show more entries. any suggestion? Thank a lot, More

rad11 rad11 · Accepted Answer · 2016-07-13T04:29:10

I think you need add a objects to your DataTable:

ordering: true,
searching: true,
order: [[0, 'asc']]//default

To your PHP code than you must add something like this for ordering:

if(count($_POST['order'])){
  $orderBy = $_POST['columns'][$_POST['order'][0]['column']]['data'];
  $orderDir = $_POST['order'][0]['dir'];
}

And for searching:

if(isset($_POST["search"]["value"]) && !empty($_POST["search"]["value"])){
  $search = $_POST["search"]["value"];
}

For entries you must put this variables to your url:

$howMany = (isset($_POST['length'])) ? intval($_POST['length']) : 10;//10 is default its size param
$start = (isset($_POST['start'])) ? intval($_POST['start']) : 0;

And put this variables to your query.

jQuery DataTable Show entries, Search box and sort not working?

1 Answers