如何根据我的AJAX结果主动增加计数器?

时间:2011-05-31 20:54:57

标签: php jquery html css ajax

我正处于我的第一个ajax项目的最后一步。我做了一个竖起大拇指的图标,当按下时,通过以下代码增加数据库中的列:

这是可见页面上的HTML和JQUERY

<div id="comment_id">+1</div>
<div id="thumb_thumb">                              
    <?php $comment_id = $result['id'];?>
    <a class="myButtonLink" href="Profile_test.php?id=<?php echo $prof->id; ?>" id="<?php echo $comment_id; ?>">Vote Up!</a>
</div>

    <script>
    $('.myButtonLink').click(function(e) {
      e.preventDefault();
      var comment_id = $(this).attr('id');
      $.ajax({ type: 'POST',
               url: 'thumbs.php',
               data: 'comment_id=' + comment_id,
               success: function(data) {
                  alert(data);
                  if(data.result == "error") {
                      alert(data.msg);
                 } else {
                      $('#numvotes').html(data.msg);
                 }
             }
      });
    });        
    </script>

这是隐藏的PHP页面

    <?php
     require_once($_SERVER['DOCUMENT_ROOT']
     . '/includes/system/init.php');

     // 1. CHECK AND SEE IF THE
     "$comment_id" IS VALID. I AM GOING TO
     RETREIVE THE VALUE OF THE $_POST BEING
     SENT FROM THE PHP PAGE THAT IS SENDING
     THE REQUEST

     /* QUERY TO CHECK $_POST DATA WITH: */

    /* this is grabbing id that jquery
     sent over via post */
     if(isset($_POST['comment_id'])) {


         /* making a variable out of the
     grabbed id */ $retreived_comment_id =
     $_POST['comment_id'];  


     $query = "UPDATE `CysticAirwaves` SET
     `thumbsUp` = `thumbsUp` + 1 WHERE `id`
     = '" . $retreived_comment_id . "'"; $request =
     mysql_query($query,$connection) ;
     $result = mysql_fetch_array($request);


     }
   ?>

所以现在我只需要在点击一个拇指并且指定的注释在db中标记为加号时动态地让我的计数器工作

<div id="comment_id">
            +1 //NEED TO MAKE THIS ACTUALLY COUNT
</div>

提前致谢

4 个答案:

答案 0 :(得分:1)

var currentCount = $('#comment_id').text();

$('#comment_id').text(++currentCount);

答案 1 :(得分:1)

一些事情。

1)您需要确保POST值为整数而非任意和/或恶意数据

$retreived_comment_id = filter_var($_POST['comment_id'], FILTER_SANITIZE_NUMBER_INT);
if(!is_int($retreived_comment_id)) {
  echo 'error';
  exit;
}

2)在使用用户输入

时确保所有数据都被转义是个好主意
$query = "
  UPDATE `CysticAirwaves` 
  SET `thumbsUp` = `thumbsUp` + 1 
  WHERE `id` = ".mysql_real_escape_string($retreived_comment_id)."
"; 

$request = mysql_query($query, $connection);

3)成功时返回'success',失败时返回'error'

$request = mysql_query($query, $connection);
if($request) {
  echo 'error';      
} else {
  echo 'success';
}

exit;

4)使用jQuery增加计数

success: function(data) {
  if(data == "success") {
    var $comment = $('#comment_id');
    $comment.html($comment.text()+1);
  }
}

答案 2 :(得分:0)

将此行放在ajax成功请求中,而不是警告(数据)

document.getElementById('comment_id').innerHTML = data;

答案 3 :(得分:0)

我注意到你没有从PHP代码返回任何东西回到ajax。您需要返回一个至少包含“msg”和“error”的数组,以便在成功时满足您当前的代码。然后为“success”=&gt;创建另一个数组元素1如果没有错误。

//your php should return your array at the end of your function like this:
return array("msg" => "some message to return", "error" => "some error if you have one", "success" => [1 or 0] );

//ajax function blah blah blah
success: function(data){
    if( data.success == 1 ){
        var currentCount = $("#comment_id").text().substr(1);
        $("#comment_id").text( currentCount+1 );
     }