CRUD delete using modal form - php

Question

I am creating a CRUD using PHP extension with PDO, and I want to create a confirmation for registry deletion using Bootstrap modals, but I don't know how I can pass the ID information to the modal to delete, how can I do it?
index.php
<tbody>
<?php
$pdo = DB::connect();
$stmt = $pdo->query("SELECT * FROM people");
while ($row = $stmt->fetch()) {
echo "<tr>";
echo "<th scope='row'>" . $row["id"] . "</th>";
echo "<td>" . $row["first_name"] . "</td>";
echo "<td>" . $row["last_name"] . "</td>";
echo "<td>" . $row["notes"] . "</td>";
if ($row["allowed"]) {
echo "<td>" . "✔" . "</td>";
} else {
echo "<td>" . "✗" . "</td>";
};
echo "<td>";
// modal trigger
echo "<button type=\"button\" class=\"btn btn-danger\" data-toggle=\"modal\" data-target=\"#exampleModal\">Delete</button>";
echo "</td>";
echo "</tr>";
}
?>
</tbody>
<!-- Modal -->
<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Do you want to delete this registry?</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
<button type="submit" class="btn btn-danger">Yes</button>
</div>
</div>
</div>
</div>

Answer 1

In this section add your ID
echo "<button type='button' class='btn btn-danger' data-toggle='modal' data-target='#exampleModal' onclick='$(".delete_id").val('".$row["id"]."')'>Delete</button>";
Then in modal add an hidden input field like so:
<input type="hidden" name="delete_id" class="delete_id">
Include jQuery before this function. You also need to have a delete file to pass that variable. After the request was success you could re-render the HTML.
function deleteRecord() {
var id = $(".delete_id").val();
$.ajax({
url:"/delete.php",
method:"POST",
data:{
id: id,
},
success:function(response) {
},
});
}
After we have stored the value of the ID we can delete it
<button type="submit" class="btn btn-danger" onclick="deleteRecord()">Yes</button>
Hope this was helpful