json增加一个id但显示所有id

时间:2016-07-23 13:47:00

标签: javascript php jquery mysql json

我正在使用json的按钮。当用户正确点击它时,会增加相似数量,并在数据库中存储相应的id,但它显示浏览器中所有ID的增量是错误的。我想只显示用户喜欢的ID,但它显示给所有人。

测试网址为http://way2enjoy.com/app/check/test/indexp.php

indexp.php文件是

<?php


include('/home/xxx/con.php');


   $query="Select * from users_jokes order by id desc limit 10";
   $result=mysql_query($query);


?>

<html>
<head>
<meta charset="utf-8">

<script src="jquery-3.1.0.min.js"></script>
<script type="text/javascript">
            var ajaxSubmit = function(formEl) {

                var url = $(formEl).attr('action');


                var comment=document.getElementById("jokes_comment").value;
                var joke_id=document.getElementById("joke_id_hidden").value;
                $.ajax({
                    url: url,
                    data:{
                        'action':'addComment',
                        'comment':comment,
                        'joke_id':joke_id
                    },
                    dataType: 'json',
                    type:'POST',
                    success: function(result) {

                            console.log(result);
                            $.ajax({
                            url: url,
                            data:{
                            'action':'getLastComment',
                            'joke_id':joke_id
                            },
                            dataType: 'json',
                            type:'POST',
                            success: function(result) {                             
                            $('#jokes_comment').val("");
                            console.log(result[0].description);
                            $("#header ul").append('<li>'+result[0].description+'</li>');                           

                            },
                            error: function(){
                            alert('failure');


                    }
                });

                    },
                    error: function(){
                        alert('failure');


                    }
                });

                // return false so the form does not actually
                // submit to the page
                return false;
            }

        var ajaxLike=function()
        {
            var joke_id=document.getElementById("joke_id_hidden").value;
            // setup the ajax request
            $.ajax(
            {
                url: 'likeskk.php',
                data:{
                    'action':'increment_like',
                    'joke_id':joke_id
                    },
                dataType: 'json',
                type:'POST',
                success: function(result) 
                {

                        $.ajax(
                    {

                        url: 'likeskk.php',
                        data:{
                            'action':'display_like',
                            'joke_id':joke_id
                            },
                        dataType: 'json',
                        type:'POST',
                        success: function(result)
                        {

                            console.log(result);
                                               $("label[for='like_counter']").text(result.likes);


                        },
                        error: function(result)
                        {
                            alert("error 2");

                        },

                    });
                },
                error: function()
                {
                    alert('failure');

                }
            });

           return false;
        }
        </script>

<p>commnet list</p>
<div id="header">
<ul id="commentlist" class="justList">
<?php
 $query="Select * from comment where joke_id='2'";
   $result=mysql_query($query);

   while($data = mysql_fetch_array($result)){

    $cont = $data['description'];
    ?>
    <li><?php echo $cont;
    ?></li>
    <?php
   }
?>
</ul>
</div>
<?php

?>
<form  method="post" action="processkk.php" onSubmit="return ajaxSubmit(this);">
<input type=text id="jokes_comment" name="jokes_comment">

</input>
<input type="submit" value="comment">

</form>
</body>
</html>


<?php 
while($data = mysql_fetch_array($result)){
    $id = $data['id'];
    $cont = $data['content'];
    $likes = $data['likes'];
    ?>
    <p><?php echo $cont;?></p>
    <input type="hidden" value="<?php echo $id ;?>" id="joke_id_hidden">
    <p><button  onClick="ajaxLike();">Like</button> <label for="like_counter"><?php echo $likes;?></label></p>
    <?php }
?>

</body>
</html>



likeskk.php 

    <?php


     include('/home/xxxxxxx/con.php');



         $action=$_POST['action'];
         if($action=="increment_like")
         {
             $joke_id=$_POST['joke_id'];
            $query="update users_jokes set likes =likes+1 where id='".$joke_id."'";
            $result=mysql_query($query);

            // setup our response "object"

            $retVal=array("Success"=>"true");
             print json_encode($retVal);

         }
          if($action=="display_like")
         {
            $joke_id=$_POST['joke_id'];
            $query = "select likes from users_jokes where id = '$joke_id'";
            $qry = mysql_query($query);
            while($rows = mysql_fetch_array($qry)){
                $likes = $rows['likes'];
            }

            header('Content-Type: application/json');
            // print json_encode(array('foo' => 'bar'));
            print json_encode(array('success'=>'true','likes'=>$likes));


         }

    ?>

当我点击一个像所有像增加。当我发布对其附加的一个ID的评论并显示在所有id

3 个答案:

答案 0 :(得分:1)

复制并粘贴。

<div class = "row">
        <div class = "icon"> <img src = "icon.PNG" alt="Some of the interesting stuff I've worked on."> </div>
        <div class = "icon"> <img src = "icon.PNG" alt="My past experiences."> </div>
</div>

答案 1 :(得分:0)

因为您使用相同的ID。 id必须是唯一的

<input type="hidden" value="4638" id="joke_id_hidden">

答案 2 :(得分:0)

您可以使用按钮本身上的数据集以及相应的ID,而不是为每个条目使用隐藏输入。单击该按钮时,javscript函数可以读取该数据集值并在ajax POST请求中使用该值。所以,作为一个例子:

<!doctype html>
<html>
    <head>
        <title>Like the jokes...</title>
    </head>
    <body>

        <form id='bttns'>
            <?php
                /* pseudo generate some jokes with buttons and labels to emulate your page */
                for( $i=1; $i < 20; $i++ ){

                    $random=rand(1,20);

                    echo "
                    <p>Funny joke...[{$i}]</p>
                    <input type='button' value='Like' data-id='$i' />
                    <label class='counter'>{$random}</label>";
                }
            ?>
        </form>

        <script type='text/javascript'>
            var col=document.querySelectorAll('#bttns input[type=\"button\"]');

            for( var n in col )if(col[n].nodeType==1)col[n].onclick=function(e){

                var el=typeof(e.target)!='undefined' ? e.target : e.srcElement;
                var label=el.nextSibling.nextSibling;
                var id=el.dataset.id;

                label.innerHTML=parseInt( label.innerHTML )+1;

                alert( 'use ajax to POST this id: '+id );
            }
        </script>
    </body>
</html>

我或许应该添加一个ajax回调函数来为每个笑话而不是像这里更新likes的值的地方 - 它只是示例代码,展示了如何消除隐藏字段和问题重复的ids。