pulsante like stile facebook

[cristina76]

Salve, avrei un problema con uno script che carica i like tipo quelli di facebook.
Con un pulsante vorrei inserire il like e successivamente con un altro click, vorrei disinserirlo.
....

<? if($righe!="") {  ?> //se l'utente ha già cliccato mi piace
<div id="bottonlike2"><span class="arancio"><i class="fa fa-heart"></i> 
<input type="button" id="bottone2" value="Ti Piace" class="mipiace"></span></div>
//se non è stato cliccato mi piace
<? } else { ?><div id="bottonlike"><span class="arancio"><i class="fa fa-heart"></i> <input type="button" id="bottone" value="Nice" class="mipiace"></span></div><? } ?>

<script type="text/javascript">
$(document).ready(function() {
  jQuery("#bottone").click(function(){
    var id = $("#id").val();
     jQuery.ajax({
      type: "POST",
      url: "like/mipiace.php",
      data: "act=like&id=" + id,
     success: function(html){
           
	  jQuery("#bottone").val('Ti piace');
	   jQuery("#bottone").attr('id','bottone2');
		
      },
      error: function()
      {
        alert("Chiamata fallita, si prega di riprovare...");
      }
    });
  });
  
  jQuery("#bottone2").click(function(){

    var id = $("#id").val();

    jQuery.ajax({
      type: "POST",
      url: "like/mipiace.php",
      data: "act=dislike&id=" + id,
      success: function(html){
      
	  jQuery("#bottone2").val('Nice');
	  jQuery("#bottone2").attr('id','bottone');
	
      },
      error: function()
      {
        alert("Chiamata fallita, si prega di riprovare..."); 
      }
    });
  });
  
});
</script>

Il mio problema è che cambia il valore del pulsante da Nice a Ti piace (l'inserimento nel db è ok), ma non cambia l'id o comunque non passa all'azione inversa! :crying:
Potreste aiutarmi per favore? Grazie

 

[criric]

Ciao, probabilmente hai già risolto, il problema è qui
var id = $("#id").val();
non esiste un tag con questo id

 

[cristina76]

Grazie, non ho risolto ancora.
Ho cambiato l'#id con #bottone ma niente!
Non so come cambiarlo per farlo funzionare. Sapresti darmi qualche suggerimento?
Grazie

 

[criric]

Io mi concentrerei su fare una sola funzione javascript, usando il selettore class per l'evento onlick e l'oggetto this per recuperare il value.

var id = $(this).val();

Come fai a capire se l'utente ha gia cliccato ? con una query ?
Che parametro usi in like/mipiace.php per filtrare ? ti basi sulla stringa del value ?

piu o meno senza averlo testato

<?php
if ($righe != "") {
    $value = "Nice";
}
?>
<div>
    <span class="arancio">
        <i class="fa fa-heart"></i>
        <input type="button" value="<?php echo $value; ?>" class="mipiace">
    </span>
</div>
<script type="text/javascript">
    $(document).ready(function () {
        jQuery(".mipiace").click(function () {
            var bottone = $(this);
            jQuery.ajax({
                type: "POST",
                url: "like/mipiace.php",
                data: "act=like&id=" + bottone.val(),
                success: function (html) {
                    
                    /**
                     * in base al response della chiamata ajax reimposti il valore del button
                     * jQuery("#bottone").val('Ti piace');
                     */
                    
                },
                error: function ()
                {
                    alert("Chiamata fallita, si prega di riprovare...");
                }
            });
        });
    });
</script>