Pagination not showing the different page numbers in server-side processing.

vhshah

Description of problem:
I have successfully set up server-side processing for my large dataset. I am showing the first page of the "length" records. I am able to see the recordsTotal as 545 and recordsFiltered as 25 from the dataset returned from the ajax call (did a console.log on the data in the dataFilter property of the ajax call. I also see the pagination text on the left side under the table as "Showing 1 to 25 of 25 entries (filtered from 545 total entries)". But the pagination controls are showing only Page 1 with Prev & Next buttons disabled.

Can somebody help me with this? Is there some mistake with the recordsTotal and recordsFiltered?

Code for the configuration of datatable (JS):

  var patTable = $('#pat_list').DataTable({
    processing: true,
    serverSide: true,
    ajax: {
      url: "ajax/dt_pat_list.php",
      type: "POST",
      dataFilter: function (data) {
        console.log (JSON.parse(data));
        return data;
      }
    },
    columns: [
      {
        data: "pat_id",
        orderable: false,
        searchable: false,
        className: "dt-center",
        render: function (data, type, row, meta) {
          var strChkbox = "";

          strChkbox = '<input class="form-check-input" type="checkbox" ';
          strChkbox += 'value="' + data + '" id="cbx_patid-' + data;
          strChkbox += '" name="cbx_patid[]">';

          return strChkbox;
        },
      },
      { data: "pat_name" },
      { data: "pat_sex" },
      { data: "pat_age" },
      { data: "pa_name" },
      {
        data: "pat_id",
        orderable: false,
        searchable: false,
        render: function (data, type, row, meta) {
          var strActions = "";

          strActions += '<span class="text-black me-3"><a ';
          strActions += 'class="text-black" style="--bs-text-opacity: .5;" ';
          strActions += 'href="visit_entry.php?patid=' + data + '"><i ';
          strActions += 'class="fa-solid fa-syringe fa-sm"></i></a></span>';
          strActions += '<span class="text-black me-3"><a ';
          strActions += 'class="text-black" style="--bs-text-opacity: .5;" ';
          strActions += 'href="pat_entry.php?id=' + data + '"><i ';
          strActions += 'class="fa-solid fa-pen fa-sm"></i></a></span>';
          strActions += '<span><a class="text-black" ';
          strActions += 'style="--bs-text-opacity: .5;" ';
          strActions +=
            'href="pat_list.php?id=' + data + '&action=delete"><i ';
          strActions += 'class="fa-solid fa-trash fa-sm"></i></a></span>';

          return strActions;
        },
      }
    ],
    pageLength: 25, //Default page length
    lengthMenu: [25, 50, 100], //Page length options
    order: [[1, 'asc']],
  });

Code for the HTML

        <table id="pat_list" class="table table-light table-hover"
          style="width:100%">
          <thead>
            <tr>
              <th class="text-center">Select</th>
              <th>Patient Name</th>
              <th class="text-center">Sex</th>
              <th class="text-center">Age</th>
              <th>Account</th>
              <th class="text-center">Actions</th>
            </tr>
          </thead>
          <tbody>
          </tbody>
        </table>

Code for the server-side
```
<?php
// Define the columns that can be sorted
$arrSortableColumns = array(
1 => 'pat_name',
2 => 'pat_sex',
3 => 'pat_age',
4 => 'pa_name'
);

// Process DataTables server-side request
$arrRequestData = $_POST;

$intDraw = intval($arrRequestData['draw']);
$intStart = intval($arrRequestData['start']);
$intLength = intval($arrRequestData['length']);
$intColumnIndex = intval($arrRequestData['order'][0]['column']);
$strSortDirection = $arrRequestData['order'][0]['dir'];

$strPaColSearchValue = $arrRequestData['columns'][4]['search']['value'];

$strSortColumn = $arrSortableColumns[$intColumnIndex];
$strSearchValue = $arrRequestData['search']['value'];

$arrQueryDetails = array(
'start' => $intStart,
'length' => $intLength,
'sortCol' => $strSortColumn,
'sortDir' => $strSortDirection,
'searchVal' => $strSearchValue,
'paSearch' => $strPaColSearchValue
);

// Query the DB
$arrPatients = Patient::getObjectsForDt($_SESSION['clinic_id'], $arrQueryDetails);

// Get total records count (without limit for pagination)
$intTotalRecords = Patient::getCountForDt($_SESSION['clinic_id'], $arrQueryDetails);

// Prepare JSON response
$objRet = array(
"draw" => $intDraw,
"recordsTotal" => intval($intTotalRecords),
"recordsFiltered" => count($arrPatients),
"data" => $arrPatients
);

echo json_encode($objRet);

<?php > ``` ?>

allan

recordsFiltered as 25

Unless you have a filter applied, then recordsFiltered should be 545.

From the documentation

• recordsFiltered: Total records, after filtering (i.e. the total number of records after filtering has been applied - not just the number of records being returned for this page of data).

Allan

vhshah

Thanks Allan. Therefore, recordsTotal should be 545 always and recordsFiltered should be whatever are the total records after applying the filter criteria (not using the start and limit in the query).

I made this change and it is now working as expected.

Thanks a lot.