Forum : Aime ou n'aime pas

Mousse

Réponse acceptée

Tu peux aussi aller t'inscrire sur Tuto.com et ensuite telecharger ce tuto qui répondra à ta question.

MrGuillou

Tu a des connaissance en ajax ?

ronytexasranger

Auteur

Non pas du tout

slyvaan

Tu peux tout simplement grâce à ajax faire que quand l'utilisateur clique sur le bouton, ça ajoute une valeur en base de données.

Imaginons que c'est pour un blog, tu aurais donc 2 tables dans la DB, la première pour les messages du blog :

Blogs

id
title
content
user_id
created
modified
...

Et la seconde pour les "J'aime, j'aime pas" qu'on appelerait Likes par exemple et qui contiendrait les champs suivants :
Likes

id_user
id_blog

Quand un utilisteur va cliquer sur "J'aime", ça va ajouter en base de donnée son id et l'id du blog qu'il a aimé.
Pour l'affichage ensuite, il te faudra vérifier si les 2 champs ont été remplit pour chaque blog, tu vérifieras donc si l'id de l'utilisateur et l'id du blog qu'il veut voir apparaissent. S'ils n'apparaissent pas c'est qu'il n'a pas aimé le blog, donc tu affiches le bouton "J'aime", et si ça apparait il faudra afficher "Je n'aime plus".

Tu peux faire ça sans ajax, mais tu perds un peu l'intérêt du truc si la page se recharge à chaque fois.

Je t'ai trouvé un petit tutorial qui me semble pas mal après l'avoir survolé brièvement pour ce que tu veux faire :

Tutorial Facebook-like Like buttons

Wala, j'espère avoir pu t'aider :)

MrGuillou

Autre exemple

HTML

<div class="new" id="n1">
    <div class="content">Blablabla</div>
    <div class="like"><a href="#">J'aime</a></div>
</div>
<div class="new" id="n2">
    <div class="content">Blablabla</div>
    <div class="like"><a href="#">J'aime</a></div>
</div>
<div class="new" id="n3">
    <div class="content">Blablabla</div>
    <div class="like"><a href="#">J'aime</a></div>
</div>
<div class="new" id="n4">
    <div class="content">Blablabla</div>
    <div class="like"><a href="#">J'aime</a></div>
</div>
<div class="new" id="n4">
    <div class="content">Blablabla</div>
    <div class="like"><a href="#">J'aime</a></div>
</div>

JAVASCRIPT

<script language="javascript" type="text/javascript">
$(document).ready(function(){
    //on détecte le click sur le lien j'aime
    $('.new .like a').click(function(e){
        //on regarde à quelle new le lien appartient, et on récupère l'id de la new
        var id = $(this).parents('.new').attr('id');

        //on envoie la requête ajax au serveur (à toi de voir la structure de l'url
        $.post("index.php?ref=news&action=like&id="+id,{}, function(data){
            //le serveur renvoie la réponse qui contient le nombre de personne qui aime
            //donc on va l'afficher à la place du lien

            //on vide la div like, donc plus de lien j'aime
            $("#"id +".like").empty();
            //et on affiche la réponse à la place
            $("#"id +".like").append(data);
        });
        //désactive l'exécution du lien pour le navigateur
        return false;
    });
});
</script>

PHP
C'est juste 2 requêtes simples dans la base
L'une qui dit que l'utilisateur aime
et l'autre qui récupère le nombre d'utilisateur qui aime

Aime ou n'aime pas

5 réponses