11521 sujets

JavaScript, DOM et API Web HTML5

Bonjour à tous,

Je suis en train de réaliser un système de votes. J'ai 2 boutons like et dislike.
J'aimerais au clic sur l'un des boutons afficher une popup avec un formulaire de connexion si l'utilisateur n'est pas authentifié. Je suis bloqué car mon code ne marche pas.


<!-- Partie HTML boutons like - dislike -->
<div class="vote" id="1">
     <div class="vote_btn">
           <div class="btn_like"><img src="thumbs-up.png" alt="like"></div><span class="votes_like">0</span>
      </div>
      <div class="vote_btn">
           <div class="btn_dislike"><img src="thumb-down.png" alt="dislike"></div><span class="votes_dislike">0</span>
      </div>
</div>
<!-- Popup -->
<div class="vote_pop" style="display:none;">
    <div class="vote_pop_content">
        <form action="" method="POST" id="vote_pop_connex">
            <h3>Connexion :</h3>
            <input type="text" name="email" required placeholder="Votre email"><br>
            <input type="submit" name="connexion" value="Connexion" class="connexx">
        </form>
    </div>
</div>


// partie php 
// j'ai juste mis une partie du code php (à ce niveau pas de problème)
// j'envoie bien ma session
$session_id = $_SESSION['user_id'];

$vote_like = ($rows5["vote_like"])?$rows5["vote_like"]:0;
$vote_dislike = ($rows5["vote_dislike"])?$rows5["vote_dislike"]:0;

$env_rep = array('vote_like'=>$vote_like, 'vote_dislike'=>$vote_dislike, 'myVar'=>$session_id);
echo json_encode($env_rep);


// partie js
$(document).ready(function() {
    $.each($('.vote'), function () {
        var unique_id = $(this).attr("id");
        //console.log(unique_id);
        post_data = {'unique_id': unique_id, 'vote': 'fetch'};
        $.post('inc/php/vote_process.php', post_data, function (response) {
            $('#' + unique_id + ' .votes_like').text(response.vote_like);
            $('#' + unique_id + ' .votes_dislike').text(response.vote_dislike);
        }, 'json');
    });
    $(".vote .vote_btn").click(function (e) {
        var click_button = $(this).children().attr('class');
        var unique_id = $(this).parent().attr("id");
        if (click_button === 'btn_dislike') {
            post_data = {'unique_id': unique_id, 'vote': 'dislike'};
            $.post('inc/php/vote_process.php', post_data, function (data) {
                var check_session = data.myVar;
                if (check_session === '') {
                    $('.vote_btn').on('click', function(){
                        $('.vote_pop').slideToggle();
                    });
                }
                $('#' + unique_id + ' .votes_dislike').text(data);
            }).fail(function (err) {
                alert(err.statusText);
            });
        } else if (click_button === 'btn_like') {
            post_data = {'unique_id': unique_id, 'vote': 'like'};
            $.post('inc/php/vote_process.php', post_data, function (data) {
                var check_session = data.myVar;
                if (check_session == '') {
                    $('.vote_btn').on('click', function(){
                        $('.vote_pop').slideToggle();
                    });
                }
                $('#' + unique_id + ' .votes_like').text(data);
            }).fail(function (err) {
                alert(err.statusText);
            });
        }
    });
});

J'ai besoin de quelqu'un pour m'aider.
Merci par avance !
Bonjour @pchlj,

Merci d'abord pour le temps précieux que tu m'as consacré.
Ce qui ne marche pas c'est l'affichage de la popup quand on clique sur le bouton like ou dislike. Je vérifie avant tout traitement si l'utilisateur n'est pas connecté. S'il est connecté on enregistre son vote et au cas contraire on lui affiche un formulaire (popup) pour s'authentifié.

C'est juste l'affichage de la popup qui m'intéresse ici. Quand je clique sur un bouton, il cherche à enregistrer le vote sans faire de vérification si je suis connecté ou pas.

Cdlt,