如何使用 Ajax 更新 Rails 中的 Button

Question

所以这是我的两难境地，我是 Rails 新手，遇到了一个我想使用 AJAX 的场景。我以前没用过AJAX，但是需要学习一下。

所以我创建了一个显示当前时间的简单网页。我想在页面上有一个按钮，当点击它时，使用 AJAX 更新当前时间。我已经在视图中完成了所有工作，并且确信我在某处遗漏了一些东西，但不确定它是什么，就像我不知道在控制器中的哪个位置我会放置额外的代码来完成这项工作。同样，这只是一个真正简单的代码，我只是想学习一个函数。

这是我的代码：

<h1>Time#index</h1>

<div id="time">

The current time is <%= Time.now  %>

</div>

<br>

<br>




<%= form_tag("/search", method: "get") do %>

  <%= label_tag(:q, "Press button to update time:") %>

  <%= submit_tag("Update") %>

<% end %>

<p>Find me in app/views/time/index.html.erb</p>

知道从这里到哪里真正有时间使用 AJAX 进行更新吗？我从搜索功能中复制了表单标签，所以请不要注意名称，只注意功能。任何帮助表示赞赏。

Answer 1

假设您创建了一个 Times 控制器：

# app/controllers/times_controller.rb
class TimesController < ApplicationController
  def index
    @time = Time.now

    # edit: I forgot to add this before, I think this will solve it.
    respond_to do |format|
      format.html
      format.js
    end
  end
end

把它连接到路由中：

# config/routes.rb
YourAppsName::Application.routes.draw do
  resources :times, only: :index
end

将您当前拥有的视图更改为此（仅使用链接而不是表单更简单）：

<h1>Time#index</h1>

<div id="time">
  The current time is <%= Time.now  %>
</div>
<br>
<br>

<%= link_to 'Update Time', times_path, remote: true %>

<p>Find me in app/views/time/index.html.erb</p>

注意remote: true，这将告诉 Rails 在单击链接时执行 AJAX 请求。该请求将转到 TimesController 的索引操作。现在添加这个 js.erb 模板来处理响应并更新视图中的时间：

# app/views/times/index.js.erb
$('#time').html("The current time is <%= @time %>");

这将更新时间。

这里有一些进一步的阅读：

http://edgeguides.rubyonrails.org/working_with_javascript_in_rails.html

http://railscasts.com/?tag_id=11

快乐的 ajaxing！