Таблица данных Серверная сторона Ajax Pagination

Question

У меня есть таблица местоположений с почти 14 тысячами записей, Мне нужна пагинация ajax с данными на стороне сервера. Я использовал код ниже, но не работает.

    <table class="table table-bordered table-striped table-hover dataTable js-exportable" id="htmltableID">
    <thead>
    <tr>

        <th>SNO</th>
        <th>Location</th>
        <th>City</th>
        <th>State</th>


    </tr>
    </thead>
    <tbody>

    <?php
    $i = 1;
    foreach ($data as $row) {
        echo "<tr>";
        echo "<td>" . $i . "</td>";
        echo "<td>" . $row->location . "</td>";
        echo "<td>" . $row->city . "</td>";
        echo "<td>" . $row->state . "</td>";
        echo "</tr>";
        $i++;
    }
    ?>
    </tbody>
</table>

<script>
    var oTable = "";
    $(document).ready(function () {
        oTable = $('#htmltableID').dataTable({
            "sPaginationType": "full_numbers",
            "bServerSide": true,
            "sAjaxSource": "location",
            "sServerMethod": "POST",
            "iDisplayLength": 5
        });
    });
</script>

Используя этот код, я получаю сообщение об ошибке Msg «Предупреждение DataTables: таблица id = htmltableID - Невозможно повторно инициализировать DataTable. Для получения дополнительной информации об этой ошибке см. http://datatables.net/tn/3" и« Предупреждение DataTables: таблица id = htmltableID - Неверный ответ JSON. Для получения дополнительной информации об этой ошибке см. http://datatables.net/tn/1"

Answer 1

Вы должны иметь ниже тип кода в основном файле. Допустим, Maindata.php

<table class="table table-bordered table-striped table-hover dataTable js-exportable" id="htmltableID">
    <thead>
        <tr>
            <th>SNO</th>
            <th>Location</th>
            <th>City</th>
            <th>State</th>
        </tr>
    </thead>
</table>

<script>
    var oTable = "";
    $(document).ready(function () {
        oTable = $('#htmltableID').dataTable({
            "sPaginationType": "full_numbers",
            "bServerSide": true,
            "sAjaxSource": "location",
            "sServerMethod": "POST",
            "iDisplayLength": 5
        });
    });
</script>

И данные (json) должны быть получены из другого файла, скажем, loadrecords.php (В вашем случае это было location/loadRecord)

<?php
// $data is the list of records fetched from database

// No need to print the data since we need to provide json data to dataTable, so Below code not required
/*
$i = 1;
foreach ($data as $row) {
    echo "<tr>";
    echo "<td>" . $i . "</td>";
    echo "<td>" . $row->location . "</td>";
    echo "<td>" . $row->city . "</td>";
    echo "<td>" . $row->state . "</td>";
    echo "</tr>";
    $i++;
}
*/

// Data which you needs to send in 'location/loadRecord' should be like this (In my case it was `loadrecords.php`)
/*{
    "data": [
        ["1","Location 1","City 1","State 1"],
        ["2","Location 2","City 2","State 2"],
        .....
        .....
        ["N","Location N","City N","State N"]
    ]
}*/

// Loop the data records fetched from database and prepare array in below format
$json_arr = array(
    "data" => array(
        array("1","Location 1","City 1","State 1"),
        array("2","Location 2","City 2","State 2"),
        ...............
        ...............
        array("N","Location N","City N","State N"),
    )
);
echo json_encode($json_arr);

данные будут иметь N № строк с 4 столбцами, так как вы хотите отобразить 4 столбца в таблице, поэтому связанные данные должны быть представлены в json