jQuery DataTables – Row selection using checkboxes
Example for article at http://www.gyrocode.com/articles/jquery-datatables-checkboxes/
by bryiantan
HTML
<link rel="stylesheet" href="//cdn.datatables.net/1.10.7/css/jquery.dataTables.min.css">
<script src="//cdn.datatables.net/1.10.7/js/jquery.dataTables.min.js"></script>
<div class="container">
<div class="panel">
<button id="loadData" class="btn btn-default">Load Data</button>
<table id="tblconsultant" class="display" cellspacing="0" width="100%">
<thead>
<tr>
<th>company</th>
<th>place</th>
<th>name</th>
<th>order</th>
</tr>
</thead>
</table>
</div>
</div>
CSS
table.dataTable.select tbody tr,
table.dataTable thead th:first-child {
cursor: pointer;
}
JavaScript
$(document).ready(function() {
var tblrecruiterslist = $('#tblconsultant').DataTable();
$.ajax({
datatype: "json",
type: "Get",
url: 'https://www.json-generator.com/api/json/get/clmDuyndua?indent=2',
success: function (data) {
rowcount = data.length;
if (data != null) {
console.log(data.data);
var pagination = true;
if (data != null && data != "") {
pagination = true;
}
else {
pagination = false;
}
var rowCount = $('#tblconsultant >tbody >tr').length;
if (rowCount != 0) {
$("#tblconsultant").DataTable().destroy();
}
tblrecruiterslist = $('#tblconsultant').DataTable({
"data": data.data,
"initComplete": function(settings, json) {
// alert( 'DataTables has finished its initialisation.' );
},
"processData": false,
"aaSorting": [0, "asc"],
"aoColumns": [
{ "mData": "company" },
{
"mData": "place"
},
{
"mData": "name"
},
{
"mData": "order"
}
]
});
$('#tblconsultant').css('width', '100%');
}
// $("#TotalCount").html(rowcount);
},
error: function (jqXHR, textStatus, errorThrown) {
}
});
$('#tblconsultant').on( 'click', 'tr', function () {
console.log('row_data');
var row_data = [];
$(this).closest('tr').find('td').each(function() {
row_data.push($(this).text());
let x = $(this);
console.log(x+...