投票中几乎没有问题

时间:2016-07-06 10:25:30

标签: php jquery mysql ajax

<?php
    include_once 'dbconnect.php';
    include_once 'index_header.php';
    $article_id = $_GET['id'];
    $counter = 0;
    // Select article from db
        $sql = $con->query("SELECT * FROM posts WHERE post_id = '$article_id'");
          if ($sql){
            while($row = mysqli_fetch_assoc($sql)) { 
            $select_title = $row['title'];
            $Select_article = $row['article'];
            }}

    if(isset($_POST['downvote'])){
    $counter = $counter - 1;

    }
    if(isset($_POST['upvote'])){
        $counter = $counter + 1;
        if($counter<=1){
    $insert_query = $con->query("INSERT INTO votes(vote_count,post_id) VALUES(1,'$article_id')");
        }
    }

    $selet_votes = $con->query("SELECT sum(vote_count) AS vote_count_sum FROM votes WHERE post_id= '$article_id'");
      if ($selet_votes){
      $row_votes = mysqli_fetch_assoc($selet_votes);
      $votes = $row_votes['vote_count_sum'];
    }
    else {
        $votes = "0";
    }
    if (empty($votes)){
        $votes = "0";
    }
    ?>

    <!DOCTYPE html>
    <html>

    <head>
        <script src="https://code.jquery.com/jquery-3.0.0.min.js"></script>
        <script type='text/javascript'>
            function switchImg() {
                if ($('#upvote').css('display') == 'none') {
                    $('#upvote').css('display', 'block');
                    $('#upvote_clicked').css('display', 'none');

                    var hr = new XMLHttpRequest();
                    // Create some variables we need to send to our PHP file
                    var url = "post.php";
                    var upvote = document.getElementById("upvote").value;
                    hr.open("POST", url, true);
                    // Set content type header information for sending url encoded variables in the request
                    hr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
                    // Access the onreadystatechange event for the XMLHttpRequest object
                    hr.onreadystatechange = function() {
                            if (hr.readyState == 4 && hr.status == 200) {
                                var return_data = hr.responseText;
                                document.getElementById("counter").innerHTML = return_data;
                            }
                        }
                        // Send the data to PHP now... and wait for response to update the status div
                    hr.send(upvote); // Actually execute the request
                } else {
                    $('#upvote').css('display', 'none');
                    $('#upvote_clicked').css('display', 'block');

                }
            }
        </script>
        <script type='text/javascript'>
            function switchImgdown() {
                if ($('#downvote').css('display') == 'none') {
                    $('#downvote').css('display', 'block');
                    $('#downvote_clicked').css('display', 'none');
                } else {
                    $('#downvote').css('display', 'none');
                    $('#downvote_clicked').css('display', 'block');
                }
            }
        </script>
        <script type='text/javascript'>
            function switchImgdown() {
                if ($('#downvote').css('display') == 'none') {
                    $('#downvote').css('display', 'block');
                    $('#downvote_clicked').css('display', 'none');
                } else {
                    $('#downvote').css('display', 'none');
                    $('#downvote_clicked').css('display', 'block');
                }
            }
        </script>

        <title>
            <?php echo $select_title; ?>
        </title>
    </head>

    <body>
        <div id="rating">
            <table>
                <tr>
                    <div class="upvote-div">
                        <input type="image" name="upvote" id="upvote" value="1" onclick="switchImg()" src="images/up.png" />
                        <input type="image" name="upvote_clicked" id="upvote_clicked" value="-1" style="display:none" onclick="switchImg()" src="images/up_clicked.png" />
                    </div>
                </tr>
                <tr>
                    <div id="counter">
                        <?php
    echo $votes;
    ?>
                    </div>
                </tr>
                <tr>
                    <div class="downvote-div">
                        <input type="image" name="downvote" id="downvote" value="-1" onclick="switchImgdown()" src="images/down.png" />
                        <input type="image" name="dowvote_clicked" id="downvote_clicked" value="1" style="display:none" onclick="switchImgdown()" src="images/down_clicked.png" />
                    </div>
                </tr>
            </table>
        </div>
        <div class="container">
            <p>
                <h2><?php echo $select_title; ?></h2></p>
            <?php echo $Select_article; ?>

        </div>
    </body>

    </html>

    <?php
    if (isset($_POST['upvote'])){
    $sql = $con->query("INSERT INTO votes(vote_count,post_id) VALUES (1,'$article_id')");

        echo "thanks for voting";
    }
    ?>

这是我的post.php我有两个问题:

主要的是当我点击投票时,我得到undefined index $article id on line 6。最初,当我编写脚本时,我创建了ajax url vote.php,当我看到错误时,我认为article_id没有传递给vote.php所以我把所有动作放在同一个页面,奇怪的是,我仍然遇到同样的问题。

我的投票系统就像stackoverflow,upvote,downvote和中间的计数器,但我不能让ajax工作。如果我发布使用表单,它不起作用。

1 个答案:

答案 0 :(得分:2)

您的问题是您没有在AJAX调用中传递正确的参数。你有这个:

 var upvote = document.getElementById("upvote").value;
 hr.send(upvote); // Actually execute the request

所以你只发送一个数字,而不是一个完整的查询字符串参数。你需要做到:

 var parameters = "id=".$yourId."&upvote=true&downvote=false";
 hr.send(parameters);

这是一个POST AJAX调用,你正在通过GET获取id。所以你也需要改变方法(第6行):

 $article_id = $_POST['id'];

通过POST发送参数并使用$_POST读取它可以解决问题。