Error when trying to put Action Button (using Json method) - php

Question

I have index.html and ajax.php with detail code in below
index.html
<div >
<!-- Table -->
<table id='empTable' class='display dataTable'>
<thead>
<tr>
<th>Employee name</th>
<th>Email</th>
<th>Gender</th>
<th>Salary</th>
<th>City</th>
<th>Action</th>
</tr>
</thead>
</table>
</div>
<!-- Script -->
<script>
$(document).ready(function(){
$('#empTable').DataTable({
'processing': true,
'serverSide': true,
'serverMethod': 'post',
'ajax': {
'url':'ajaxfile.php'
},
'columns': [
{ data: 'emp_name' },
{ data: 'email' },
{ data: 'gender' },
{ data: 'salary' },
{ data: 'city' },
{ data: 'action' },
]
});
});
</script>
</body>
ajaxfile.php
$empQuery = "select * from employee WHERE 1 ".$searchQuery." order by ".$columnName." ".$columnSortOrder." limit ".$row.",".$rowperpage;
$empRecords = mysqli_query($con, $empQuery);
$data = array();
while ($row = mysqli_fetch_assoc($empRecords)) {
$data[] = array(
"emp_name"=>$row['emp_name'],
"email"=>$row['email'],
"gender"=>$row['gender'],
"salary"=>$row['salary'],
"city"=>$row['city'],
"action"=><a class='btn btn-xs btn-warning' href='user_edit.php?uid='".$row['id']."'; '>
<i class='fa fa-pencil'></i> Ubah Data
</a>
);
}
## Response
$response = array(
"draw" => intval($draw),
"iTotalRecords" => $totalRecords,
"iTotalDisplayRecords" => $totalRecordwithFilter,
"aaData" => $data
);
echo json_encode($response);
then im trying to put action button "user_edit" using my usual method but not working. However if me put action"=>row['id']; the code is working fine. My question is how to put action button with value from row['id']; . Thank you

Answer 1

try this one, your action should be an String. Inside the class you can add something like delete-button. And remove the href or remove the link and just add a number sign like href="#", since you are working with ajax. We dont want to go to other page.
$data[] = array(
"emp_name"=>$row['emp_name'],
"email"=>$row['email'],
"gender"=>$row['gender'],
"salary"=>$row['salary'],
"city"=>$row['city'],
"action"=>"<a class='btn btn-xs btn-warning delete-button'
uid='".$row['id']."'; '><i class='fa fa-pencil'></i> Ubah Data</a>"
);
and then in yout html file or js file, you can create an event for that specific button that has a class of delete-button.
$('.delete-button').on('click',function(){
//get the id by
var = $(this).attr('uid');
//functions here
$.post('http://ajaxfile.php').then(function(res){
//reload the datatables
$('#empTable').DataTable.draw();
});
});
for more details explanation you can watch this videos.
https://www.youtube.com/results?search_query=jquery+datatables+server-side+processing+

Answer 2

Try this way
write action in variable and assign that variable to array action
while ($row = mysqli_fetch_assoc($empRecords)) {
$action = "<a class='btn btn-xs btn-warning' href='user_edit.php?uid='".$row['id']."'; '>
<i class='fa fa-pencil'></i> Ubah Data
</a>";
$data[] = array(
"emp_name"=>$row['emp_name'],
"email"=>$row['email'],
"gender"=>$row['gender'],
"salary"=>$row['salary'],
"city"=>$row['city'],
"action"=>$action;
);
}