[英]jquery datable add checkbox for object initialised table
I am trying to get a checkbox column added to the jQuery datable, however am unable to do so. 我试图将复选框列添加到jQuery datable,但是无法这样做。
My data table is initialised with a JSON object data and I want to add a column of checkboxes before the data. 我的数据表是用JSON对象数据初始化的,我想在数据前添加一列复选框。 The data table shows the data but not check box column. 数据表显示数据,但不显示复选框列。 The relevant code is as follows 相关代码如下
HTML 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 CODE 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 CODE TO GET DATA FROM MYSQL DATABASE 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();
I have searched through the forums but all of the results i get are for ajax sourced data and not ones populated like I do. 我已经搜索了所有论坛,但得到的所有结果都是针对ajax数据,而不是像我一样填充的数据。
Regards, 问候,
You can try this: 您可以尝试以下方法:
HTML 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: 使用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+'" />';
},
}]
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.