Question

我的问题是Jquery DataTables在加载时挂起，不会显示php脚本中的任何数据：

这是我的HTML：

 <!-- Default box -->
  <div class="box">
    <div class="box-header with-border">
      <h3 class="box-title">Time Management</h3>

      <div class="box-tools pull-right">
        <button type="button" class="btn btn-box-tool" data-widget="collapse" data-toggle="tooltip" title="Collapse">
          <i class="fa fa-minus"></i></button>
        <button type="button" class="btn btn-box-tool" data-widget="remove" data-toggle="tooltip" title="Remove">
          <i class="fa fa-times"></i></button>
      </div>
    </div>
    <div class="box-body">
       <table id="example" class="table table-bordered table-hover">
           <thead>
               <tr>
               <th>ID</th>
               <th>Clock In</th>
               <th>Lunch Started</th>
               <th>Lunch Ended</th>
               <th>Clock Out</th>
               </tr>
           </thead>
       </table>
    </div>
    <!-- /.box-body -->
    <div class="box-footer">
      Footer
    </div>
    <!-- /.box-footer-->
  </div>
  <!-- /.box -->

我的Jquery代码：

<script>
$(document).ready(function() {
$('#example').DataTable({
   "ajax": "api/timemanageprocess.php", 
   "dataSrc": '',
   "type": "POST",

"columns": [
    {"data": "PASS_ID"},
    {"data": "CLOCK_IN"},
    {"data": "START_LUNCH"},
    {"data": "END_LUNCH"},
    {"data": "CLOCK_OUT"}
    ],
  });
});
</script>

我的PHP脚本的结果。我回应了json_encode（）的结果：

我尝试在DataTable（）中使用"data": data & "data": json作为选项。我试图用大括号来定义ajax的选项。我已尝试完全排除dataSrc=''，我已尝试删除type: 'POST'并将其留给GET。我知道我的PHP脚本地址是正确的。我不知道它是什么，或者它们阻止数据填充数据表。有人可以帮我搞清楚吗？提前致谢。非常感谢帮助。

PHP：

include ('../includes/sessions.php');

$select = "SELECT PASS_ID, CLOCK_IN, START_LUNCH, END_LUNCH, CLOCK_OUT FROM timeclock WHERE USERNAME = '$sessuser'";

 $query = mysqli_query($dbc, $select) or die(mysqli_error($dbc));
 $resnum = mysqli_num_rows($query);

 //echo $resnum;
 while($row = $query->fetch_assoc()){

  $out[] = $row;

  }
  echo json_encode(array('data' => $out));
  mysqli_free_result($query);
  $dbc->close();
  ?>

Answer 1

按照Louys Patrice Bessette的建议，在PHP方面，我将数组转换为json对象而不是json数组。我，然后我没有引用选项。所以而不是：

$('#example').DataTable({
   "ajax": "url", 
   "columns" : [
    {"data": "keyname"},
     {"data": "keyname"},
    ]
})

我做了：

   $('#example').DataTable({
   ajax: "url", 
   columns : [
     {"data": "keyname"},
     {"data": "keyname"},
    ]
})

我也删除了dataSrc选项。

Answer 2

在您收到的json中，没有data属性。

如果您可以修改json的生成方式，请将所有对象放在data对象中......就像their documentation中提供的示例一样：

{
  "data": [
    {
      "name": "Tiger Nixon",
      "position": "System Architect",
      "salary": "$320,800",
      "start_date": "2011/04/25",
      "office": "Edinburgh",
      "extn": "5421"
    },
    /...

或者，如果你不能修改json，请尝试这样的事情：（我没有测试过这个......你必须尝试）

  "columns": [
    {"PASS_ID"},
    {"CLOCK_IN"},
    {"START_LUNCH"},
    {"END_LUNCH"},
    {"CLOCK_OUT"}
    ],
  });

<小时/> 的修改

只是为了确保json没有问题...
尝试从另一个ajax请求中请求它（就像测试一样）：

$.ajax({
  url: "api/timemanageprocess.php",
  method: "post",
  dataType: "json",
  success: function(response){
    console.log( JSON.stringify(response) );
  },
  error: function(request, status, errorThrown){
    console.log(errorThrown);
  }
});

如果结果没问题，我们将围绕Datatable进行调查这个想法是为了缩小问题...
;）

Jquery DataTables：数据未通过Ajax

2 个答案: