jquery数据添加复选框的对象初始化表

Question

我想获得一个复选框列添加到jQuery datable，但我无法这样做。

我的数据表是用JSON对象数据初始化的，我想在数据前添加一列复选框。数据表显示数据但不显示复选框列。相关代码如下

HTML

<table id="mytable" class="table table-striped table-bordered" cellspacing="0" width="100%"> 


    <thead> 
      <tr> 
       <th>Request ID</th> 
       <th>Request Date</th> 
       <th>Leave Type</th> 
       <th>Start Date</th> 
       <th>End Date</th> 
       <th>Status</th> 
      </tr> 
     </thead> 
    </table> 

JavaScript代码

msg = $.parseJSON(msg); 
      console.log(msg); 
      $('#mytable').DataTable({ 
       data: msg, 
       columns: [ 
        { data: 'RequestID' }, 
        { data: 'RequestDate' }, 
        { data: 'LeaveType' }, 
        { data: 'LeaveStart' }, 
        { data: 'LeaveEnd' }, 
        { data: 'Status' } 
       ], 
       "columnDefs": [ { 
        "targets": 0, 
        "searchable": false, 
        "data": null, 
        "defaultContent": "<button>Click!</button>" 
       }] 
      }); 

PHP代码获取数据从MySQL数据库

$result = $conn->query($sql); 
//$result = $result->num_rows; 

if($result->num_rows >0){ 
    $res = array(); 
    while($row =mysqli_fetch_assoc($result)) 
    { 
     $res[] = $row; 
    } 
    //$res = array("data"=>$res); 
    $output = json_encode($res); 

} else 
{ 
$output = 'fail'; 
} 

echo $output; 
die(); 

我已经通过论坛，但所有的搜索我得到的结果是针对ajax的数据，而不是像我这样的人。

问候，

Answer 1

你可以试试这个：
HTML

<table id="mytable" class="table table-striped table-bordered" cellspacing="0" width="100%"> 
    <thead> 
     <tr> 
      <th><input type="checkbox" name= "check_all" id="check_all" value="1" /></th> 
      <th>Request ID</th> 
      <th>Request Date</th> 
      <th>Leave Type</th> 
      <th>Start Date</th> 
      <th>End Date</th> 
      <th>Status</th> 
     </tr> 
</thead> 

的Javascript：

msg = $.parseJSON(msg); 
$('#mytable').DataTable({ 
    data: msg, 
    columns: [ 
     { data: 'RequestID' }, 
     { data: 'RequestDate' }, 
     { data: 'LeaveType' }, 
     { data: 'LeaveStart' }, 
     { data: 'LeaveEnd' }, 
     { data: 'Status' } 
    ], 
    "columnDefs": [ { 
     "targets": 0, 
      "searchable": false, 
      "data": "RequestID", 
      "render": function (data, type, full, meta) { 
        return '<input type="checkbox" name= "check_id[]" data-id="'+data+'" />'; 
      }, 
    }] 
});