Мой код Ajax не обновляет мою любимую кнопку

Question

Я пробовал другой код, чтобы иметь любимую кнопку, которая будет меняться (изображение), когда вы нажимаете на нее - избранное / не избранное без обновления страницы, но она не работает. с этим кодом, когда я нажимаю на избранную кнопку, страница не перезагружается, но ничего не меняется, изображение (пустое сердце) не меняется и ничего не записывается в базу данных ...

 // ************************* AJAX 


 <script type="text/javascript" src="https://ajax.googleapis.com.   /ajax/libs/jquery/1.9.0/jquery.min.js"></script>
 <script type="text/javascript">
 $(function(){
    $("#refreshAjout").click(function(){
   $.ajax({
       type: "POST",
       url: $("#refreshAjout").attr('action'),
       success: function(retour){

       }
        });
            return false;
    });
  });

  $(function(){
    $("#refreshSupp").click(function(){
   $.ajax({
       type: "POST",
       url: $("#refreshSupp").attr('action'),
       success: function(retour){

       }
        });
            return false;
    });
   });
 </script>

А это мой php-код для кнопки и функции для добавления или удаления данных из БД

 <?php

 // If user not connected
 if ($_SESSION['pseudo'] == NULL){ 


 echo '<a href="../../index-auth-creer-compte.php"><img src="../..   /images/empty-heart.jpg" class="ajouter"</img> </a>';

  }

 // If user connected
 if (isset($_SESSION['pseudo']) && isset($_SESSION['pass'])){

 // We check if the key exist in DB
 $req="SELECT count(*) FROM favoris WHERE profil='".$test."'"; 
 $res=mysql_query($req);

 // if key not in DB we show empty heart button
 if(mysql_result($res,0)==0 ) { 
 ?>

 <form method="post" action="">
 <button type="image" id="refreshAjout" class="ajouter" value=""   name="refreshAjout"></button> 
 </form> 

 <?php   
 // if key in DB we show pink heart   
 } else{ ?>

 <form method="post" action="">
 <button type="image" id="refreshSupp" class="supprimer" value=""    name="refreshSupp"></button> 
 </form> 

 <?php
    }
   }

И, наконец, функция для размещения или удаления информации в БД

if (isset($_POST['refreshAjout']) ) {

$sql = "INSERT INTO favoris (id, client, profil, photo, prenom,   reference, age, lien) VALUES('','$pseudo' ,'$pseudo$referenceBase','$photoBase','$prenomBase', '$referenceBase', '$ageBase','$lienBase')";
mysql_query($sql) or die('Erreur SQL ! '.$sql.'<br>'.mysql_error());
}

if (isset($_POST['refreshSupp'])  ) {

$sql = "DELETE FROM favoris  WHERE profil ='$pseudo$referenceBase'";
mysql_query($sql) or die('Erreur SQL ! '.$sql.'<br>'.mysql_error());
}
?>

Answer 1

Вы не отправляете никаких параметров в своих $.ajax вызовах, поэтому $_POST будет пустым. Вам необходимо использовать опцию data: для отправки параметров.

Вы можете объединить обе кнопки отправки в одном вызове, поскольку параметры можно получить из самого элемента.

$(function() {
  $("#refreshAjout, #refreshSupp").click(function() {
    var newSrc = this.id == "refreshAjout" ? "../../images/pink-heart.jpg" : "../../images/empty-heart.jpg";
    $.ajax({
      type: "POST",
      url: $(this).attr('action'),
      data: { [this.id]: this.value },
      success: function(retour) {
        $(".ajouter").attr("src", newSrc);
      }
    });
    return false;
  });
});