DataTables 警告：表 id=users_list - JSON 响应无效。有关此错误的更多信息，请参阅 http://datatables.net/tn/1答案

【问题标题】：DataTables warning: table id=users_list - Invalid JSON response. For more information about this error, please see http://datatables.net/tn/1DataTables 警告：表 id=users_list - JSON 响应无效。有关此错误的更多信息，请参阅 http://datatables.net/tn/1
【发布时间】：2019-08-15 08:49:09
【问题描述】：

我根据活动-非活动状态从用户表中获取数据，之后应该使用数据表显示 foreach 循环数据，但出现错误

DataTables 警告：表 id=users_list - JSON 响应无效

所以我的要求是

1) Show all data in the data table
2) per page 5 records
3) Default search box of a data table
4) Pagination of a data table

以下是我的代码，但这对我不起作用在 index.php 文件下拉列表中，基于 onchange 事件 ajax 调用 ajax 控制器中的 users_list 方法。

In index.php  file drop-down list with ajax call request



 <select class="custom-select" onchange="get_users(this.value)">
        <option value="active">Active</option>
        <option value="inactive">Inactive</option>
    </select>
<div class="show_data"></div>

    <script>
    function get_users(status){
    $.ajax({
    type:'POST',
    url:'<?php echo SITE_URL . 'ajax/users_list'; ?>',
    data:{ status:status},        
    success: function(data)
    {        
    $(".show_data").html(data);
    },
    error: function (jqXHR, textStatus, errorThrown)
    {
    alert('Failed');
    }
    });
    }

    </script>

在控制器 Ajax.php 中

function users_list(){
$status=$this->input->post('status');   //active  or inactive 
$data['users']=$this->db->where('status',$status)->get('users')->result();
$this->load->view('view_assets',$data); 
}

在 view_assets.php 文件中

<table id="display_userinfo">
    <thead>
        <tr class="bg-light">
            <th>user id</th>
            <th>user name</th>
            <th>Mobile no</th>
        </tr>
    </thead>
    <?php foreach ($users as $user) { ?>
        <tbody>
            <tr>
                <td><?= $user->id ?></td>
                <td><?= $user->name ?></td>
                <td><?= $user->mobile ?></td>
            </tr>
        <?php } ?>
    </tbody>
    <script>
        $('#display_userinfo').DataTable({
            "processing": true,
            "serverSide": true,
        });
    </script>

【问题讨论】：

标签： php jquery datatable

【解决方案1】：

JavaScript

当您调用 DataTable() 时，您已将 ServerSide 设置为 true。但是您已经创建了表。改变这个：

    $('#display_userinfo').DataTable({
        "processing": true, //Optional, only useful for *large* tables
        //"serverSide": true, //REMOVE THIS
    });

来自他们的文档：

默认情况下，DataTables 在客户端处理模式下运行，但可以使用此选项切换到服务器端处理模式。服务器端处理在处理大型数据集（通常 > 50,000 条记录）时很有用，因为这意味着可以使用数据库引擎来执行排序等计算 - 现代数据库引擎高度优化的操作，允许使用 DataTables拥有海量数据集（数百万行）。

如果您打算提供 DataTable() JSON，则应仅使用 ServerSide。否则，您可以在没有 ServerSide 标志的情况下运行 DataTable()，它会将您的 HTML 转换为其格式。

如果您重新调整后端，您仍然可以使用ServerSide，但可能没有必要。下面是一个入门示例：

$('#display_userinfo').dataTable( {
  "serverSide": true, //Here it's necessary
  "ajax": {
     "url": '<?php echo SITE_URL . 'ajax/users_list'; ?>',
     "data": {}
   }
});

HTML

您还犯了一个小标记错误，这可能会或可能不会对 DataTables 产生影响。更改以下内容：

    <tbody> <!-- This needs to be BEFORE the foreach() loop -->
<?php foreach ($users as $user) { ?>
            <tr>
                <td><?= $user->id ?></td>
                <td><?= $user->name ?></td>
                <td><?= $user->mobile ?></td>
            </tr>
        <?php } ?>
    </tbody> <!-- Correctly placed *AFTER* the foreach() loop -->

【讨论】：