DataTables 1.10 从 json 解析 aadata 在 HTML5 上失败答案

【问题标题】：DataTables 1.10 parse aadata from json failed on HTML5DataTables 1.10 从 json 解析 aadata 在 HTML5 上失败
【发布时间】：2014-09-27 00:07:51
【问题描述】：

我目前正在使用 HTML5，所以我需要使用 DataTabels 1.10

问题是 ajaxsouce 无法从我拥有的 php 文件中解析 json。实际上它运行良好，并且仍然适用于我在 DataTables 1.9.4 和 HTML4 上的项目，但不知何故我未能将它与 DataTables 1.10 和 HTML5 一起使用

这就是我调用我的 ajax 的方式：

$(document).ready(function() {
$('#example').dataTable( {
    "ajax": "viewobat1.php"
} );

});

我也改成"sAjaxSource": "viewobat1.php"了，但是也不行

这就是我在viewobat.php 中为获取 json 所做的操作

$sql="SELECT * FROM obat";
$hasil=mysql_query($sql);
print("{\"aaData\":[");
$tambahan="\n";
$no=0;
while($cetak=mysql_fetch_array($hasil))
    {$no++;
    $no;
        $idobat=$cetak[0];
        $tanggalmasuk=$cetak[1];
        $namaobat=$cetak[2];
        $jenis=$cetak[3];
        $macam=$cetak[4];
        $keterangan=$cetak[5];
        $stok=$cetak[6];

    print($tambahan."[\"$no\","."\"$idobat\","."\"$tanggalmasuk\","."\"$namaobat\","."\"$jenis\","."\"$macam\",
    "."\"$keterangan\","."\"$stok\]");
    $tambahan=",\n";

    }
    print("\n]}\n");
?>

我的 json 没有任何问题，PHP 正在返回一个有效的 JSON 数组

但数据不会显示在表格上，

我错过了什么吗？

~已编辑~

我已经通过 datatables.net 的服务器端教程更改了获取所需数据的方式 ---> SERVER SIDE

我的代码是这样的，

<?php
error_reporting(0);
$table = 'obat';

$primaryKey = 'idobat';
$columns = array(
    array( 'db' => 'idobat', 'dt' => 0 ),
    array( 'db' => 'tanggalmasuk',  'dt' => 1 ),
    array( 'db' => 'namaobat',   'dt' => 2 ),
    array( 'db' => 'jenis',     'dt' => 3 ),
    array( 'db' => 'macam', 'dt' => 4 ),
    array( 'db' => 'keterangan',  'dt' => 5 ),
    array( 'db' => 'stok',   'dt' => 6 ),
);

$sql_details = array(
    'user' => 'root',
    'pass' => '',
    'db'   => 'medical',
    'host' => 'localhost'
);

require( 'js\DataTables-1.10.2\examples\server_side\scripts\ssp.class.php' );

echo json_encode(
    SSP::simple( $_GET, $sql_details, $table, $primaryKey, $columns )
);

当然... PHP 再次返回有效数据

我也以与教程完全相同的方式调用 ajax...

当然...数据仍然不会出现在我的表中...

再说一遍，我错过了什么吗？ (O_o)

【问题讨论】：

标签： php json html datatables

【解决方案1】：

是的...我找到了答案（这是个奇怪的答案）

刚刚将我的脚本更改为 -->

<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="http://cdn.datatables.net/1.10.2/js/jquery.dataTables.min.js"></script>

它成功了……这很奇怪，不是吗……？我知道..

我不知道为什么我应该使用需要 http 的 CDN 而不是使用 PATH_TO_FOLDER 方法从我自己的服务器调用它，

但它仍然有效，来自问题的参考 --> cant get datatables net working with javascript

【讨论】：

【解决方案2】：

department.php（服务器端）

<?php
    $qry="select dept_id,dept_name from tb_department ";
    $result=mysqli_query($connection,$qry);           
    $data=array();
    $i=0;
    while($row=mysqli_fetch_assoc($result)){
         $data[] = $row;
    }
    $response = array(
        'aaData' => $data,
        'iTotalRecords' => count($data),
        'iTotalDisplayRecords' => count($data)
    );
    echo json_encode($response);
?>

index.php（客户端）

 <table id="example"  class="table table-bordered table-striped  table-hover">
     <thead>
         <tr>
             <th>Department ID </th>
             <th>Department Name</th>
         </tr>
      </thead>
      <tfoot>
         <tr>
              <th>Department ID </th>
              <th>Department Name</th>
         </tr>
       </tfoot>
  </table>

  <script >
     $(document).ready(function(){
     var table= $('#example').DataTable( {
     ajax: {
          url: 'department.php',
          dataSrc: 'aaData',
          method:'POST'
     },
     columns: [
          { data: 'dept_id' },
          { data: 'dept_name' }
     ],
   });
   </script>

此代码对我有用....！使用 dataTable 1.10 , jQuery 2.1.0

【讨论】：