Answers

• kthorngren Posts: 21,330Questions: 26Answers: 4,951

  March 2023

  Start with this FAQ discussing option to help increase the load time. deferRender only works with ajax or data loaded data. Looks like your data is DOM sourced so the browser will render the table then Datatables will process and re-render the table. You can check the page load time without initializing Datatables to see the difference.

  Can you change to using ajax loaded data? deferRender will work in this case and may help. Possibly you will need to use Server Side Processing with a server script that supports the SSP protocol.

  Kevin
• yinkoh Posts: 4Questions: 1Answers: 0

  March 2023

  Thanks for your answer.

  I've already read the FAQ and prefer, if I can, not use SSP because the rest of the project is working fine with datatables and simple ajax but not within datatable.
  I also tried ajax with server side style to feed the data but in that case, i'm stuck with pagination acting weird. Ie: when displaying 20 results with items per page set to 10, I'm having the correct amount of buttons for pagination. However as I click on "2", the page failed to load with a no results message.
• kthorngren Posts: 21,330Questions: 26Answers: 4,951

  March 2023

  However as I click on "2", the page failed to load with a no results message.

  Are you saying you have both ajax and serverSide enabled? Unless your server script supports the SSP protocol remove the serverSide and all the table data will be fetched and paging should work. Like these examples.

  Kevin
• yinkoh Posts: 4Questions: 1Answers: 0

  March 2023 edited March 2023

  Here's how the server side code goes:

  php:
  [code]
  function get_list() {
  $input = $_POST;

  $return_data = array(
  'draw' => intval($input['draw']),
  'recordsTotal' => intval(0),
  'recordsFiltered' => intval(0),
  'data' => NULL,
  );

  $search = $input['search']['value'];
  if ( empty($search) ) {
  echo json_encode($return_data);
  return TRUE;
  }

  $data = array();
  $query = $this->db->get('mytable')->like('person_name', $search)->order_by('person_name');
  $count_filtered = count($query->result());
  foreach ($query->result() as $row) {
  $data[] = array(
  $item->id,
  $item->licence,
  $item->person_name,
  );
  }

  $query = $this->db->get('mytable')->like('person_name', $search);
  $count = count($query->result());

  $return_data = array(
  'draw' => intval($input['draw']),
  'recordsTotal' => intval($count),
  'recordsFiltered' => intval($count_filtered),
  'data' => $data,
  );
  echo json_encode($return_data);
  return TRUE;
  }
  [/code]

  html:
  [code]

  #	Licence	Name

  $(document).ready(function() { $('#table-data-player').DataTable( { processing: true, serverSide: true, ajax: { url: url/get_list, type: 'POST', } }); });

  [/code]

  On first load, the list is sent empty so no data is loaded => Ok.
  When a search is typed, results are displayed and pagination is correct => Ok.
  When clicking on "2" from pagination labels, things get weird => Ko.
  

  I suppose I did something wrong but can't figure out where.
• kthorngren Posts: 21,330Questions: 26Answers: 4,951

  March 2023

  Start by not enabling serverSide: true. Are you planning to have many thousands of rows in the table?

  Kevin
• yinkoh Posts: 4Questions: 1Answers: 0

  March 2023

  Ok, I found my (dumb) mistake.

  I assumed "recordsFiltered" was the count of the data after filtering.
  I just switch "recordsFiltered" and "recordsTotal", now it works like a charm.

  Thanks for your time.