如何使用php实现Jquery-upvote插件

时间:2018-04-06 22:43:29

标签: javascript php jquery

我的项目中有一个jQuery插件up vote。我希望有一个上下投票功能,如堆栈溢出,但我完全混淆如何通过上面的投票插件函数传递值到我的PHP文件。我试图在Ajax中传递我的id param,但我只获得了第一行的id。我曾经使用点击事件处理程序,以便我可以跟踪单击哪一行,但我无法使用此功能实现该方法。或者有人可以解释如何在我的页面上使用php实现上述jQuery插件。

我的HTML for php for loop:

  $sample = $this->db->prepare("SELECT * from Ratings");
  $sample->execute();
  $RES = $sample->fetchAll(PDO::FETCH_ASSOC); 
  foreach ($RES as $data){

      $upVote =  $data['Upvote'];
      $downvote =  $data['Downvote'];
      $counter = $data['Counter'];

echo '<tr>

        <td>
        <div value='.$id.' name="id" class="upvote upvoteForm upvote-serverfault">
         <a class="upvote">'.$upVote.'</a>
                <span class="count">'.$counter.'</span>
                 <a class="downvote">'.$downvote.'</a>
                 <a class="star"></a>
       </td></tr>';
    }

我的jquery功能:

<script>
var callback = function(element) {
    $.post(
     "voting.php/",
     {
         id: $(".id").val(),
         upvoted: $(".upvote").val(),
         downvoted:  $(".downvote").val(),
         star: $(".star").val()
     },
   );
};
$('.upvoteForm').upvote({callback});

</script>

1 个答案:

答案 0 :(得分:1)

查看Initialization examples in the doc。回调方法接收一个对象,该对象保存当前已投票元素的数据。不要尝试使用jQuery选择器检索值,请使用element参数。如果我正确理解文档,如果保留DOM结构并添加data-id属性,甚至可以完全省略数据对象:

<div data-id="'.$id.'" class="upvote upvoteForm upvote-serverfault">

var callback = function(element) {
    $.post(
         "voting.php/",
         // this object could probably be omitted
         {
             id: element.id,
             upvoted: element.upvoted,
             downvoted:  element.downvoted,
             star: element.star
         },
    );
};
$('.upvoteForm').upvote({callback: callback});

注意:我没有对此进行测试,也不保证它有效: - )