pdo button delete row - php

Question

when specific user login it will display what he has books.. and inside each book delete button .. i want delete row when i clicked on delete button ... but when i clicked on delete button it reload the page please i need help
this getbooks function
public function getBooks($start = 0, $limit = 2)
{
$sql_start = $start * $limit;
$sql_limit = $limit;
//SELECT loginUser.username, Library.nameOfBook FROM loginUser JOIN userBook JOIN Library ON userBook.user_id = loginUser.id AND userBook.book_id = Library.id WHERE loginUser.username="loay";
$query = "SELECT Library.nameOfBook FROM loginUser JOIN userBook JOIN Library ON userBook.user_id = loginUser.id AND userBook.book_id = Library.id WHERE loginUser.username=:username LIMIT $sql_start, $sql_limit";
$statment = $this->db->prepare($query);
$statment->execute([
':username' => $this->username
//,':start' => $start, ':limit' => $limit
]);
$result = $statment->fetchAll();
echo "<table border='1'>
<form method='POST'>
<tr>
<th>Books</th>
<th>Action</th>
</tr>";
foreach($result as $row){
echo "<tr>";
echo "<td>" . $row['nameOfBook'] . "</td>";
echo "<td>" ."<input type='submit' name='delete' value='Delete' method='post' >" . "</td>";
echo "</tr>";
}
echo "</table>";
echo "</form";
if(isset($_POST['delete'])){
die("SS");
}
}

Answer 1

I made the delete functionality using jquery and ajax.
Above your form code add:
<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
<script>
function deleteBook(b) {
$(document).ready(function() {
var book = $(b).parent('td').prev('td').html();
if(confirm("Are you sure you want to delete book - "+book+"?") == false){
return;
}
var ids = $(b).attr('id').substr(6).split('-');
var book_id_to_delete = ids[0];
var user_id = ids[1];
//alert("book_id is " + book_id_to_delete + ", user_id is " + user_id);
$.ajax({
type: "POST",
url: "" + "deletebook.php",
data: {
'book_id': book_id_to_delete,
'user_id': user_id,
submit: 'submit',
},
success: function(res) {
if (res == "deleted") {
$(b).closest('tr').remove();
} else {
alert(res);
}
}
});
});
}
</script>
In getBooks() function, I added id attribute (containing book and user ids) in delete button so our js code will know which books of a user should be deleted.
Replace your getBooks() function with:
<?php
public function getBooks($start = 0, $limit = 2)
{
$sql_start = $start * $limit;
$sql_limit = $limit;
$query = "SELECT Library.nameOfBook, userBook.book_id, userBook.user_id FROM loginUser JOIN userBook JOIN Library ON userBook.user_id = loginUser.id AND userBook.book_id = Library.id WHERE loginUser.username=:username LIMIT $sql_start, $sql_limit";
$statment = $this->db->prepare($query);
$statment->execute([
':username' => $this->username
]);
$result = $statment->fetchAll();
echo "<table border='1'>
<tr>
<th>Books</th>
<th>Action</th>
</tr>";
foreach($result as $row){
echo "<tr>";
echo "<td>" . $row['nameOfBook'] . "</td>";
echo "<td>" ."<input type='submit' id='delete".$row['book_id']."-".$row['user_id']."' onclick='deleteBook(this)' name='delete' value='Delete'>" . "</td>";
echo "</tr>";
}
echo "</table>";
echo "";
if(isset($_POST['delete'])){
die("SS");
}
}
?>
Create a class function that handles user's book deletion.
In your User class in User.php, add the following function:
public function deleteBook($book_id, $user_id)
{
$stmt = $this->db->prepare("DELETE FROM userBook WHERE book_id = :book_id AND user_id = :user_id");
$stmt->bindValue(":book_id", $book_id);
$stmt->bindValue(":user_id", $user_id);
return $stmt->execute();
}
The below code will be executed by via ajax so that the chosen book will be deleted from database.
Create a file named - deletebook.php
And add this code:
<?php
include_once('User.php');
if(isset($_POST['submit'])){
$object = new User();
if($object->deleteBook($_POST['book_id'], $_POST['user_id'])){
die('deleted');
}
else {
die("fail");
}
}
?>