带有 Codeigniter MYSQL 查询的数据表

Posted 2023-05-07

【中文标题】带有 Codeigniter MYSQL 查询的数据表

【英文标题】：DataTables with Codeigniter MYSQL query

【发布时间】：2016-09-16 17:06:37

【问题描述】：

我正在尝试显示三个数据表，如this page 所示，其中包含从我的数据库中获取数据的变体，如here 所示。

我首先使用静态数据（来自arrays.txt - 第一个链接）测试了该页面，它运行良好。但是，我现在正在为 mysql 数据和 JSON 苦苦挣扎。 显示“处理中...”的信息消息出现，但表格保持为空。

我的 javascript：

$(document).ready(function()
        $('a[data-toggle="tab"]').on( 'shown.bs.tab', function (e) 
        $.fn.dataTable.tables( visible: true, api: true ).columns.adjust();
     );

    $('table.table').DataTable( 
        "processing": true,
        "serverSide": true,
        "ajax": 
            "dataSrc": "Data", // Tried adding this but didn't help
            "url": "/hireStaffController/getDataTable",
            "type": "POST"
        ,
        "columns": [
             "data": "id_staff" ,
             "data": "name_english" ,
             "data": "name_french" ,
             "data": "position" ,
             "data": "efficiency" ,
             "data": "salary" 
        ]
     );  

我的控制器：

public function getDataTable()
   $data = $this->staffModel->get_all_staff_DB();   
   echo json_encode($data);     

我的模特：

public function get_all_staff_DB()
  $query = $this->db
        ->select('*')
        ->from('game_staff')
        ->get();
  return $query->result();

Firebug 的 JSON 响应似乎是正确的：

   [
        "id_staff": "1",
        "name_english": "Ski patrol 1",
        "name_french": "Pisteur secouriste 1",
        "position": "skipatrol",
        "efficiency": "50",
        "salary": "1500"
    , 
        "id_staff": "10",
        "name_english": "Bus driver 2",
        "name_french": "Chauffeur de bus 2",
        "position": "driver",
        "efficiency": "55",
        "salary": "1380"
    ]

Firebug 抛出此错误：

TypeError: c is undefined
...iRecordsDisplay=parseInt(f,10);d=0;for(e=c.length;d<e;d++)N(a,c[d]);a.aiDisplay=...
                                           ^

所以我尝试在 Ajax 中添加"dataSrc": "Data",，如here 所述，但没有运气，同样的错误。这是什么Data？我也尝试了一个小的“d”。

你能看出哪里不对吗？

我的 html 代码：

<div class="tab-pane active" id="tab-table1">
    <table id="myTable1" class="table table-striped table-bordered" cellspacing="0" >
         <thead>
             <tr>
                 <th>Name</th>
                 <th>Position</th>
                 <th>Office</th>
                 <th>Extn.</th>
                 <th>Start date</th>
                 <th>Salary</th>
             </tr>
          </thead>
      </table>
  </div>
<div class="tab-pane" id="tab-table2">
    <table id="myTable2" class="table table-striped table-bordered" cellspacing="0" >
             //same ...
     </table>
</div>

【问题讨论】：

如果您仍然卡住，这里有一些优秀的库。我将这个与 CI 3 一起使用：github.com/zepernick/Codeigniter-DataTables 他的博客：paulzepernick.com/open-source/codeigniter/…

【参考方案1】：

尝试将“数据”作为回显数据的键：

public function getDataTable()
   $data = $this->staffModel->get_all_staff_DB();   
   echo json_encode(array('Data' => $data));     

当您将 dataSrc 指定为“Data”时，datatables 会在 ajax 调用返回的 json 中查找“Data”属性，并将该属性用作表的源。

【参考方案2】：

我希望 HTML 表格存在于那里。 尝试使用 ID 而不是类。 你所做的其他一切看起来都很好。

$('#ID').DataTable( 
        "processing": true,
        "serverSide": true,
        "ajax": 
            "url": "/hireStaffController/getDataTable",
            "type": "POST"
        ,
        "columns": [
             "data": "id_staff" ,
             "data": "name_english" ,
             "data": "name_french" ,
             "data": "position" ,
             "data": "efficiency" ,
             "data": "salary" 
        ]
     );  

【讨论】：

我尝试了$('#myTable1').DataTable( ，但它并没有改变任何东西。我将我的 HTML 添加到问题中