I am trying to add a confirmation message before deleting a data in my table. But I don't know how and where to put the code. I tried look up other codes but it doesn't work.
Here is my code:
<?php $a = 0?>
<?php while ($row = mysqli_fetch_array($res)) {
echo "<tr id=".$a++.">
<th scope='row' class='row-data'>".$row['user_id']."</th>
<td class='row-data'>".$row['full_name']."</td>
<td class='row-data'>".$row['user_name']."</td>
<td><input type='button'
value='EDIT'
onclick='editUser()'' /></td>
<td><input type='button'
value='DELETE'
onclick='deleteUser()' /></td>
</tr>
</tbody>";
}; ?>
function deleteUser() {
var rowId =
event.target.parentNode.parentNode.id;
//this gives id of tr whose button was clicked
var data =
document.getElementById(rowId).querySelectorAll(".row-data");
/*returns array of all elements with
"row-data" class within the row with given id*/
var uID = data[0].innerHTML;
document.getElementById("toBeEdit").value = uID;
document.getElementById("taskStatus").value = 'delete';
//alert("ID: " + uID);
const form = document.getElementById('editForm');
form.submit();
}
</script>
You can use the built-in method confirm() in your deleteUser() function. Please see below code,
function deleteUser() {
if(confirm('Are you sure want to delete user?')){
var rowId =
event.target.parentNode.parentNode.id;
//this gives id of tr whose button was clicked
var data =
document.getElementById(rowId).querySelectorAll(".row-data");
/*returns array of all elements with
"row-data" class within the row with given id*/
var uID = data[0].innerHTML;
document.getElementById("toBeEdit").value = uID;
document.getElementById("taskStatus").value = 'delete';
//alert("ID: " + uID);
const form = document.getElementById('editForm');
form.submit();
}
}
The confirm() method displays a dialog box with a message, an OK button, and a Cancel button.
The confirm() method returns true if the user clicked "OK", otherwise false.
You should to add this code include your delete function
if(window.confirm("do you want delete this data")){
-->your code with js<--
}else{
return false;
}