TypeError: Cannot read properties of undefined (reading ‘length’) in DataTable

I want to populate a DataTable using the jQuery ajax but I keep bumping into a TypeError: Cannot read properties of undefined (reading ‘length’).

For context, I am using the Hope UI datatable template for this.

Here’s the HTML code for the table:

<div class="table-responsive">
    <table id="boards_table" class="table table-striped" data-toggle="data-table">
        <thead>
            <tr>
                <th>Model</th>
                <th>Serial</th>
                <th>Revision</th>
                <th>Owner</th>
                <th>Date Owned</th>
                <th>Updates</th>
                <th>Notes</th>
                <th>Date Added</th>
                <th>Status</th>
                <th>History</th>
            </tr>
        </thead>

        <tfoot>
            <tr>
                <th>Model</th>
                <th>Serial Number</th>
                <th>Revision</th>
                <th>Owner</th>
                <th>Date Owned</th>
                <th>Updates</th>
                <th>Notes</th>
                <th>Date Added</th>
                <th>Status</th>
                <th>History</th>
            </tr>
        </tfoot>
    </table>
</div>

This is the script I use for the Ajax call:

$(document).ready(function() {
    var table = window.DataTable = $('#boards_table').DataTable({
        "order": [],
        "bootstrap": true,
        "bAutoWidth": true,
        "responsive": true,
        "processing": true,
        "serverSide": true,
        "aLengthMenu": [
            [25, 50, 75],
            [25, 50, 75]
        ],
        "pageLength": 25,
        "ajax": {
            url: "boards-ajax.php",
            type: "POST",

            "data": {
                GetBoards: "Yes",
            },

            error: function(xhr, textStatus, errorThrown) {

                var error = textStatus;
                var details = errorThrown;
                console.log(xhr.responseText);
                console.log("Status=" + xhr.status + "nStatusText=" + xhr.statusText + "nError=" + error + "&Detail=" + details)

            }
        },

        "dom": 'Bfrtip',
        "buttons": [{
            extend: 'excelHtml5',
            className: 'btn btn-link btn-soft-light',
            exportOptions: {
                columns: [2, 3, 4],
            }
        }],
        "initComplete": function(settings, json) {
            table.buttons().container().appendTo($('#boards_table_wrapper .col-sm-6:eq(0)'));
        },
    });
   
    $("#global_search").on('keyup', function() {
        table
            .search(this.value)
            .draw();
    });
});

And this is the PHP script the gets the data from the database:

if (isset($_POST['GetBoards'])) {

    if ($InventoryCon->connect_errno) {

        header('HTTP/1.1 503 Service Unavailable');
        exit();

    } else {

        $Query = "Select *    From boards     Where IsDeleted=0;";
        $AllRecords = array();
        $Result = mysqli_query($InventoryCon, $Query);

        if (!mysqli_query($InventoryCon, $Query)) {

            header('HTTP/1.1 500 Internal Server Error');
            throw new ErrorException($InventoryCon->error, 500);
            exit();

        } else {

            while ($Row = mysqli_fetch_assoc($Result)) {
                $RowArray = array();
                $RowArray[] = $Row['ModelName'];
                $RowArray[] = $Row['SerialNumber'];
                $RowArray[] = $Row['RevisionNumber'];
                $RowArray[] = 'Owner';
                $RowArray[] = $Row['DateOwned'];
                $RowArray[] = $Row['Updates'];

                // Notes icon
                $RowArray[] = 'Note Column';


                $RowArray[] = $Row['DateAdded'];

                //Status button
                $RowArray[] = 'Status Column';


                // History button
                $RowArray[] = 'History Column';

                $AllRecords[] = $RowArray;
            }
            $output = array(
                "draw" => 25,
                "recordsTotal" => mysqli_num_rows($Result),
                "recordsFiltered" => 25,
                "data" => $AllRecords
            );
            
                echo json_encode($output );
    
        }

        mysqli_close($InventoryCon);
    }
}

The Ajax call returns 200 OK and if I add a success function, I can see that the data is also returned as it should.

I scoured the internet to see what solutions other people found, but none did the trick.