Javascript 使用Ajax更新Rails中的元素

该应用程序允许用户对嵌入式视频进行投票。当用户单击上下箭头时，整个页面将刷新以更新

点

。几个月来，我一直在尝试实现AJAX投票。我希望您能提供最直接的解决方案，即使它不是最有效的。有什么想法吗

我的

向上

和

向下

来自

app/controllers/links\u controller的操作

  ....

  def up
    @link = Link.find(params[:id])
    @link.update_attribute :points, @link.points + 1
    redirect_to :back 
  end

  def down 
    @link = Link.find(params[:id])
    @link.update_attribute :points, @link.points - 1
    redirect_to :back 
  end 

  ....

links\u list

的极简版，来自

app/views/links/\u links\u list

的一部分，我使用各种排序方法在其他视图中呈现

  <% @links.each do |link| %>
        <div class="row">
            <div class="span2">
                <%= link_to (image_tag ("up.png")), up_link_url(link), :method => :put %> 
                <%= link.points %>
                <%= link_to (image_tag ("down.png")), down_link_url(link), :method => :put %>
            </div>
            <div class="span8">
                <%= link_to strip_tags(link.title), link %> 
            </div>
        </div>
  <% end %>

：put%>
：put%>

• 我想在不使用外部gem的情况下实现这一点，该应用程序已经在生产中
• 我可能看过并尝试过大多数与ajax和rails相关的Rails3教程。如果你发布了一个教程的链接，请建议需要进行的mods，以使其工作
• 我正在运行Rails 3.1

---

提前感谢您的任何反馈或建议

Ajax在Rails 3.1中非常容易使用。本文假设您使用jQuery作为JavaScript驱动程序；如果您没有，您将需要安装jquery rails gem，但即使对于正在生产的应用程序，添加一个小gem也不是什么大问题

您的控制器最终将如下所示：

....

def up
  @link = Link.find(params[:id])
  @link.update_attribute :points, @link.points + 1
  respond_to do |format|
    format.html {redirect_to :back}
    format.js
  end
end

def down 
  @link = Link.find(params[:id])
  @link.update_attribute :points, @link.points - 1
  respond_to do |format|
    format.html {redirect_to :back}
    format.js
  end
end 

....

视图更改将非常小：

<% @links.each do |link| %>
  <div class="row">
    <div class="span2">
      <%= link_to (image_tag ("up.png")), up_link_url(link), :method => :put, :remote => true %> 
      <%= link.points %>
      <%= link_to (image_tag ("down.png")), down_link_url(link), :method => :put, :remote => true %>
     </div>
     <div class="span8">
       <%= link_to strip_tags(link.title), link %> 
     </div>
  </div>

：put，：remote=>true%>
：put，：remote=>true%>

您需要在app/views/links/文件夹中添加新文件up.js.erb和down.js.erb，其中包含更新页面的JavaScript命令：

$(".span2").html("This post has <%= @link.points %> points.")

$（“.span2”）.html（“这篇文章有要点。”）

---

如果你决定使用原型或者其他东西，代码看起来或多或少都是一样的；唯一的变化是您在up.js.erb和down.js.erb中放置的JavaScript，它应该是Prototype-y而不是jQuery-y。

太棒了，我一直在寻找这个解决方案，但解决方案总是关于基本CRUD。。。。。thanx。。。。。。。。。