添加AJAX，並與同一個按鈕刪除

Question

我試圖創建一個點擊時會添加記錄到數據庫，然後再次單擊時按鈕，將刪除從數據庫這個記錄（這是一個'favourite'按鈕） 。

我希望它的工作如下;

用戶點擊「最愛」按鈕>按鈕狀態更改爲成功>記錄添加

用戶點擊「最愛」按鈕再次>狀態更改爲默認>記錄從數據庫

到目前爲止我的代碼刪除接下來（更新代碼感謝@Peter）;

books_model.php

class BooksModel 
{ 
public function checkFav($bookid,$userid) 
{ 
    $book_id=$_REQUEST['book_id']; 
    $user_id=$_SESSION['user_id']; 

    $sql = "SELECT * FROM favourite WHERE user_id=? AND book_id=?"; 
    $query = $this->db->prepare($sql); 
    $query->bind_param('ii', $userid,$bookid); 
    $query->execute(); 
    $query->store_result(); 
    $rows_found = $query->num_rows(); 
    if(empty($rows_found)) { 
     $sql = "INSERT INTO favourite (user_id, book_id) 
       VALUES (?, ?)"; 
     $query = $this->db->prepare($sql); 
     $query->bind_param('ii',$userid,$bookid); 
     $query->execute(); 

    } else { 
     $sql = "DELETE FROM favourite WHERE user_id=? AND book_id =?"; 
     $query = $this->db->prepare($sql); 
     $query->bind_param('ii',$userid,$bookid); 
     $query->execute(); 
    } 
} 
} 

books_controller.php

class Books extends Controller 
{ 
function checkFav() 
{ 
    $checkFav_model = $this->loadModel('Books'); 
} 
} 

itemView.php

$(document).ready(function(){ 
$("#fav").click(function(){ 
$(this).toggleClass("btn-success"); 
book_id = $(fav).val(); // set the value of the button (book_id) 

    $.ajax({ 
     type: 'POST', 
     url: '<?php echo URL; ?>books/checkFav', //location of query 
     data: {book_id:book_id}, //taken from value of button 

     success: function() { 
      $("div.addtofavs").slideToggle("slow"); //show div below button 
      }//end success   
     });//end ajax 
    }); 
}); 

按鈕HTML

<button id="fav" value="'.$book->id.'" type="button" class="btn btn-default"></button> 

目前，當我按一下按鈕，並期待在控制檯中，我可以看到的帖子，但沒有被髮送到我的分貝。

任何意見或方向是讚賞，因爲我是相當新的MVC和JS。

Answer 1

public function checkFav($bookid,$userid) 

{ 

$sql = "SELECT * FROM favourite WHERE user_id=:userid AND book_id=:bookid"; 
$query = $this->db->prepare($sql); 
$query->bindParam(':userid', $userid); 
$query->bindParam(':bookid', $bookid); 
$query->execute(); 
$rows_found = $query->countRows(); 
if(empty($rows_found)) { 
    $sql = "INSERT INTO favourite (user_id, book_id) VALUES (:userid, :bookid)"; 
    $query = $this->db->prepare($sql); 
    $query->bindParam(':userid', $userid); 
    $query->bindParam(':bookid', $bookid); 
    $query->execute(); 

} else { 
    $sql = "DELETE FROM favourite WHERE user_id=:userid AND book_id =:bookid"; 
    $query = $this->db->prepare($sql); 
    $query->bindParam(':userid', $userid); 
    $query->bindParam(':bookid', $bookid); 
    $query->execute(); 
} 
} 
$book_id=$_REQUEST['book_id']; 
$user_id=$_SESSION['user_id']; 
checkFav($book_id,$user_id); 

Answer 2

你可以簡單地做一個檢查： SELECT * FROM favourite WHERE user_id = :user_id AND book_id = :book_id

如果返回的東西，執行 DELETE FROM favourite WHERE user_id = :user_id AND book_id = :book_id

做其他插件。

如果要顯示書籍已添加爲用戶的收藏夾，則必須在頁面加載時執行另一個呼叫，該按鈕會爲該按鈕提供一個屬性，該屬性告訴您和用戶它已經是最喜歡的或不喜歡的。

在最後一種情況下，您不必再進行檢查。只是執行刪除查詢，如果它包含的屬性，否則做INSERT

// try to get the attribute of the button 
var attr = $(".favoriteButton").attr('data-favorite'); 
// check the button has the attribute 
if (typeof attr !== typeof undefined && attr !== false) { 
    //delete query 
    $.ajax({ 
     type: 'POST', 
     url: '<?php echo URL; ?>books/deleteFav', //location of query 
     data: {book_id:book_id}, //taken from value of button 

     success: function() { 
      $("div.addtofavs").slideToggle("slow"); //show div below button 
      }//end success   
     });//end ajax 
    }); 
} 

類似的東西

Answer 3

使用通用瓦爾：請將isDeleted變種; var IsAdded;那麼IsDeleted = 0; IsAdded = 1; （你的書被添加）。刪除書籍IsDeleted = 1時再次更改值; IsAdded = 0;當你執行$（「#fav」）。點擊（函數（）檢查這些值，做你想要的（添加，刪除）什麼樣的行動。

Answer 4

<button class="fvrt" data-item-id="11" data-current-state="0"> Like <button> // 0 = normal, 1 = liked 

$(document).on('click', '.fvrt', function(){ 

    if($(this).attr('data-current-state') == 0){ 

     like_item($(this).attr('data-item-id')); // send ajax request 
     $(this).attr('data-current-state', '1'); 
     $(this).val('Liked'); 

    }else{ 

     dislike_item($(this).attr('data-item-id')); // send ajax request 
     $(this).attr('data-current-state', '0'); 
     $(this).val('Like'); 

    } // checking state 

}); // on clicked