带有 rails 3、jquery 和 ajax 的简单喜欢/不喜欢按钮答案

【问题标题】：Simple like/unlike button with rails 3, jquery, and ajax带有 rails 3、jquery 和 ajax 的简单喜欢/不喜欢按钮
【发布时间】：2011-09-22 20:46:53
【问题描述】：

我有一个产品、用户和类似模型。用户可以喜欢产品。我正在尝试实现一个简单的喜欢按钮，单击该按钮后，用户可以喜欢产品。然后，like 按钮转换为like 按钮，允许用户不喜欢产品。很简单。

我已经实现了上述的模型/控制器逻辑。我对 javascript/ajax 不是很好，想知道实现上述功能的最佳方法是什么。我希望通过 ajax 处理喜欢/不喜欢的动作。我正在为我的应用程序使用 rails 3 和 jquery ujs。

谢谢。

【问题讨论】：

标签： jquery ajax ruby-on-rails-3 ujs

【解决方案1】：

我对你的问题的回答很长，所以我写了一个example application。这是一个sn-p：

给这只猫换皮的方法有很多，但我喜欢渲染部分和单个 ujs 模板。

_like_button.html.erb:

<% if like = current_user.likes.find_by_product_id(@product.id) %>
  <%= form_for like, :html => { :method => :delete },
                     :remote => true do |f| %>
    <%= f.submit "Unlike" %>
  <% end %>
<% else %>
  <%= form_for current_user.likes.build(:product_id => @product.id), :remote => true do |f| %>
    <%= f.hidden_field :product_id %>
    <%= f.hidden_field :user_id %>
    <%= f.submit "Like" %>
  <% end %>
<% end %>

toggle.js.erb，其中"#like" 是包含表单的 div：

$("#like").html("<%= escape_javascript render('like_button') %>");

【讨论】：

伙计，你这样做真是太棒了。您的示例应用程序确实帮助我理解了它是如何工作的。谢谢一吨！
@dwhalen，我再也找不到链接的示例应用程序了。我正在尝试在我的应用程序中做同样的事情，并且我的应用程序中的代码几乎相同。第一次一切正常，Like 按钮出现，点击它时，它切换到 Like。但是，当我尝试单击不同按钮时，没有任何反应。有什么建议吗？
如何向数据库中添加一些内容，以便实际查看此示例？
按照自述文件：github.com/invisiblefunnel/soquestion6482354#getting-started。 rake db:seed.
@dwhalen，非常感谢这个例子！我现在理解得更好了 :) 我只有一个问题：当我单击“不喜欢”时，我在日志中收到错误 ActiveRecord::RecordNotFound (Couldn't find Like with id=11): app/controllers/likes_controller.rb:9:in destroy'`。在我再次点击之前，“不喜欢”不会更新为“喜欢”……你知道为什么吗？

【解决方案2】：

基本上，要使您的链接通过 AJAX 工作，您只需提供 link_to 和 :remote => true 参数。但我猜你想对用户做出某种反馈。看看this 截屏视频。

【讨论】：