Система голосования с jQuery, PHP и Smarty

Question

Я сделал голосование на своем сайте, используя только PHP и Smarty. Это самый HTML часть этого:

<p>{$vote} <a href="vote.php?q_vote=vote_up&question_id={$qid}"><i class="icon-thumbs-up"></i></a> <a href="vote.php?q_vote=vote_down&question_id={$qid}"><i class="icon-thumbs-down"></i></a></p> 

РНР часть кода принимает голос и обновляет ту же страницу.

Я хочу сделать то же самое, используя jQuery, чтобы он не нуждался в обновлении страницы. Вот что я написал в HTML:

$("#q_upvote").click(function() 
    { 
     var vote = "vote_up"; 
     var votedata = ""; 
     votedata = "vote= " + vote; 
     $.ajax({     
       type: 'POST', 
       url: 'vote.php', 
       data: votedata, 
       success: function(vote_msg){ 
       if(msg == 'ok') 
        { 
        //show the new vote 
        } 
             else 
             //show notification 
       } 
    } 
) 
</script> 

Я не мог понять, как показать там новое голосование. Можете ли вы мне помочь? Также я ценю, если мне скажут, что если я пойду правильно.

Answer 1

• Исправленная ваш HTML-код, так что у вас есть заполнитель для количества голосов.

• Исправлен вызов Ajax, так что он передает те же параметры, что и в hrefs в исходном якоре.

• Исправлены различные синтаксические ошибки в вызове Ajax

HTML код

<p> 
     <span class="votenumbers">{$vote}</span> 
     <a id="upvote_{$qid}" class="q_upvote" href="#"><i class="icon-thumbs-up"></i></a> 
     <a href="vote.php?q_vote=vote_down&question_id={$qid}"><i class="icon-thumbs-down</i</a> 
    </p> 

JQuery код

$(".q_upvote").click(function() 
    { 
     var vote = "vote_up", 
      question_id = this.id.split('_')[1], 
      votedata = "q_vote="+vote+"&question_id="+question_id; 
     $.ajax({     
       type: 'POST', 
       url: 'vote.php', 
       data: votedata, 
       success: function(vote_msg){ 
        if(vote_msg== 'ok') 
         { 
         //show the new vote 
         $(this).find('.votenumbers').closest().html(parseInt($(this).find('.votenumbers').closest().html())+1) 
         } 
        else{ 
         //show notification 
        } 
       } 
      }); 
    } 
) 

Answer 2

На момент вы знаете, что голосование было сохранено правильно, вы можете просто увеличивать свой голос на стороне клиента, например:

<script type="text/javascript"> 
var votes = 0; 
$("#myVoteNumberDiv").html(votes); 
</script> 

В точке //show the new vote вы бы написать:

votes++; //or in case he voted down: votes--; 
$("#myVoteNumberDiv").html(votes); 

Скажите, если вы имели в виду что-то другое, я не совсем уверен, что правильно понял ваш вопрос.