below is my simple viewing using datatable. How can I add buttons to my datatable? I have a simple viewing of data after button onclick. What I want is to have a button as the 4th column for insert query purposes. How can I embed it on my codes? Thanks in advance.
My script
function view() {
let EmployeeID = document.getElementById('employee-id').value;
console.log(EmployeeID);
let testTable = $('#table_view').DataTable();
$.ajax({
type: "POST",
dataType: "json",
url: "@Url.Action("ViewEmployee")",
data: {
'EmployeeID': EmployeeID,
},
beforeSend: function () {
$.dialog({
icon: 'fa fa-spinner fa-spin',
title: 'Loading',
content: 'Loading, Please Wait...',
showConfirmButton: false,
draggable: false,
closeIcon: false
});
},
success: function (result) {
var delay = 500;
$('.jconfirm').fadeOut(delay);
var interval = setInterval(function () {
clearInterval(interval);
}, delay)
if (result.success) {
var columns = []
var jsonData = $.parseJSON(result.data);
var json = jsonData.Table = null ? '' : jsonData.Table;
if (json.length > 0) {
var colNames = Object.keys(json[0])
for (var i in colNames) {
columns.push({ data: colNames[i], title: colNames[i], className: colNames[i],});
}
testTable.destroy()
testTable.clear().draw()
$('#table_view').empty()
$('#table_view').DataTable({
//dom: 'Bfrtip',
columns: columns,
data: json,
scrollX: true,
});
}
else {
testTable.destroy()
testTable.clear().draw()
}
}
else {
alert(result.message);
}
}
});
}