使用Ajax加载数据时DataTables无法正常分页的问题求助

I'm using DataTables to display data returned via an Ajax request. DataTables can fetch the data, but it won't paginate correctly. The bottom info shows "Showing 0 to 0 of 0 entries (filtered from NaN total entries)", and the pagination buttons display "Previous 1 2 3 4 5 ... NaN Next". There's clearly an issue, but I can't figure out where I went wrong.

Returned Data Format #

My PHP page returns data from an SQL query in this format (136 total records):

[{
  "hospital_name": "Advanced Surgical",
  "raw_description": "Removal of breast lesion",
  "full_payer_name": "Aetna Auto: Medical OP",
  "plan_type": "Commercial",
  "price": "$2,968.40"
}, ...]

My DataTables Initialization Code #

$('#results').DataTable( {
    "processing": true,
    "serverSide": true,
    searching: false,
    "ajax": {
        "url": "./php/getDataForCode.php",
        "type": "POST",
        "data": {code: $code}, // Variable passed to the query
        "dataSrc": ""
    },
    columns: [
        { title: "Hospital", data: "hospital_name" },
        { title: "Description", data: "raw_description" },
        { title: "Insurer", data: "full_payer_name" },
        { title: "Insurer type", data: "plan_type"},
        { title: "You Pay", data: "price" }
    ]
} );

What am I doing wrong in the data parsing step?

The core issue here is that you've enabled serverSide: true but your PHP backend isn't returning the structured JSON response that DataTables expects for server-side processing.

When server-side mode is on, DataTables doesn't handle pagination, filtering, or counting on the client side—it expects your backend to:

• Accept pagination parameters (like start, length) from the DataTables request
• Return a JSON object with specific mandatory fields:
  • draw: The same draw number sent in the request (used for request/response synchronization)
  • recordsTotal: Total number of records before filtering
  • recordsFiltered: Total number of records after filtering (if no filtering is applied, this matches recordsTotal)
  • data: The array of records to display for the current page

Right now, you're just returning a flat array of data. DataTables can't find the recordsTotal/recordsFiltered values it needs to calculate totals and pagination, so it defaults to NaN for totals and shows 0 entries.

Fix Options: #

Option 1: Disable Server-Side Processing (Simplest for Your Case)

Since you only have 136 records—way below the threshold where server-side processing becomes necessary—you can just turn off serverSide: true. DataTables will handle pagination, sorting, etc., entirely on the client side using your existing data format:

$('#results').DataTable( {
    "processing": true,
    // Remove or set to false: "serverSide": true,
    searching: false,
    "ajax": {
        "url": "./php/getDataForCode.php",
        "type": "POST",
        "data": {code: $code},
        "dataSrc": ""
    },
    columns: [
        { title: "Hospital", data: "hospital_name" },
        { title: "Description", data: "raw_description" },
        { title: "Insurer", data: "full_payer_name" },
        { title: "Insurer type", data: "plan_type"},
        { title: "You Pay", data: "price" }
    ]
} );

Option 2: Update PHP Backend to Support Server-Side Processing

If you anticipate larger datasets in the future and want to keep server-side processing, modify your PHP code to return the required structured response. Here's a basic example:

// Get DataTables request parameters
$draw = isset($_POST['draw']) ? intval($_POST['draw']) : 1;
$start = isset($_POST['start']) ? intval($_POST['start']) : 0;
$length = isset($_POST['length']) ? intval($_POST['length']) : 10;
$code = $_POST['code'];

// Fetch paginated data (adjust based on your database driver)
// Example for MySQL:
$sql = "SELECT hospital_name, raw_description, full_payer_name, plan_type, price 
        FROM your_table 
        WHERE code = ? 
        LIMIT ?, ?";
// Bind parameters: $code, $start, $length
// Execute query and fetch $data array

// Get total number of records without pagination
$totalSql = "SELECT COUNT(*) FROM your_table WHERE code = ?";
// Execute query and get $recordsTotal

// Build the required response structure
$response = [
    "draw" => $draw,
    "recordsTotal" => $recordsTotal,
    "recordsFiltered" => $recordsTotal, // No filtering applied, so matches total
    "data" => $data
];

echo json_encode($response);
exit;

With this structured response, DataTables will correctly display pagination counts and handle page navigation as expected.

内容的提问来源于stack exchange，提问作者LauraNMS