Ajax-request在rails中设置喜欢/不喜欢

时间:2015-12-18 01:45:45

标签: jquery ruby-on-rails ruby ajax ruby-on-rails-4

我想在我的RoR应用程序上做出喜欢/不喜欢的能力。我如何通过Ajax请求创建它?

不喜欢和喜欢 - 是整数 我怎样才能发出Ajax请求,而不是我可以在我的方法中发送我想要增加“喜欢”或“不喜欢”计数器的数据

我有一个帖子表:

的应用程序/视图/仪表板/ view.html.erb

<table>
  <%if @post.count!=0%>
    <%@post.each do |p|%>
      <%if !p.text.nil?%>
      <tr>
       <td><b class="margin"><h4><%=p.text%></b></h4></td>
       <td>by <%=p.user.username%>&nbsp;&nbsp; </td>
       <td><span class="glyphicon glyphicon-thumbs-up likeAction"><%= link_to p.like, dashboard_like_path, :remote => true, :id => 'likecount' %> </td>
       <td><span class="glyphicon glyphicon-thumbs-down"><%= link_to p.dislike, dashboard_dislike_path, :remote => true, :id => 'dislikecount' %> </td>
      <%end%>
    <% end %>
  <%else%>
    There's no posts yet, but you can add <%=link_to "one", dashboard_posts_create_a_post_path%>
  <%end%>
</table>

我的js文件

#app/views/dashboard/view.js
$('#likecount').text(@post.like);
$('#dislikecount').text(@post.dislike);

我在控制器中的方法:

def like
    @post.increment!(:like)
    respond_to do |format|
      format.html
      format.js
    end
  end

  def dislike
    @post.increment!(:dislike)
    respond_to do |format|
      format.html
      format.js
    end
  end

我的资产/ javascripts中的dashboard.js

jQuery(function($) {
  $("likeAction").click(function(){
     $.ajax({
        url: dashboard_like_path,
        type: 'POST',
        success: function(){
            $('#linkcount').text(data);
        }
        error: function(error){
           alert(error);
        }
     });
  });
});

1 个答案:

答案 0 :(得分:1)

您可以使用Rails remote =&gt;真正的用于进行ajax调用的函数。您可以查看更多详细信息here

现在回答你的问题,

我。创建类似&amp;的链接不喜欢:

<td><span class="glyphicon glyphicon-thumbs-up"><%= link_to p.like, <link-of-like-path>, :remote => true, :id => 'likecount' %> </td>
<td><span class="glyphicon glyphicon-thumbs-down"><%= link_to p.dislike, <link-of-dislike-path>, :remote => true, :id => 'dislikecount' %></td>

II。现在在控制器中你将收到Ajax请求&amp;你需要以js格式给出回应。所以你喜欢的方法就像:

def like
   @post.increment!(:like)
   respond_to do |format|
      format.html
      format.js
   end
end

def dislike
   @post.increment!(:dislike)
   respond_to do |format|
      format.html
      format.js
   end
end

III。 create(action_name).js.erb文件来处理js响应。在你的情况下,它将是app / view / posts文件夹中的like.js.erb文件。在这里编写js代码来替换喜欢/不喜欢计数。

$('#likecount').text(@post.like);
$('#dislikecount').text(@post.like);

如果你想使用当前代码,那么你需要在控制器中添加json处理程序

respond_to do |format|
  format.html
  format.json {@post.like}
end

然后使用ajax成功替换like as,

等文本
jQuery(function($) {
  $("likeAction").click(function(){
     $.ajax({
        url: path-to-like-function,
        type: 'POST',
        success: function(){
            $('#linkcount').text(data);
        }
        error: function(error){
           alert(error);
        }
     });
  });
});