Я сделал голосование на свой сайт, используя только 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> Часть кода PHP принимает голосование и обновляет одну и ту же страницу.
Я хочу сделать то же самое, используя 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>
Я не мог понять, как показывать там новые голоса. Можете ли вы мне помочь? Также я ценю, если мне скажут, что если я пойду правильно.
Исправлен ваш 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 } } }); } )
В тот момент, когда вы знаете, что голосование было сохранено правильно, вы можете просто увеличить свой голос на стороне клиента, например:
<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);
Скажите, если вы имели в виду что-то другое, я не совсем уверен, что правильно понял ваш вопрос.