Ruby on Rails 3中的Ajax on html块

Question

我想在我的Ruby on Rails 3应用程序中使用Ajax。问题是我想让Ajax链接包含一个div标记。如果可能的话，我更希望使用jQuery而不是prototype。我该如何做到这一点呢？

我想要一个解决方案涉及一些像link_to这样的rails类型的编程。

Answer 1

首先，将'jquery-rails‘gem添加到Gemfile中：

gem 'jquery-rails'

然后运行bundle install和rails g jquery:install。就这样。现在您可以使用jQuery了。

在视图中添加div，例如：

<div id='ajax_div'><%= @article.title %></div>

现在你可以用这种方式包含一些javascript：

$(
  function(){
    $("#ajax_div").click(function(){
      $.ajax(...)
    }
  }
)

关于$.ajax的更多信息：http://api.jquery.com/jQuery.ajax/ (您可以使用$.post、$.get或$.getScript)

更新

通过link_to使用ajax

<%= link_to some_path, :remote => true do %>
  <div id='ajax_div'><%= @article.title %></div>
<% end %>

从头开始的

让我们创建新的rails应用程序。从头开始。来展示ajax是如何工作的。我不会对其进行测试，因此这里可能会出现输入错误和错误。

• rails new ajaxapp
• cd ajaxapp
• rails g scaffold Comment body:text
• rake db:create
• rake db:migrate
• add gem 'jquery-rails' to Gemfile rails g jquery:install

安装=>捆绑包

让我们编辑comments/index.html.erb：

<h1>Listing comments</h1>

<%= link_to comments_path, :remote => true, :method => :post do %>
  <div>Click me to add random comment</div>
<% end -%>
<div id='comments'>
  <%= render @comments %>
</div>

_comment部分：

<p>
  <%= comment.body %>
</p>

现在我们将添加app/views/create.js.erb文件：

$("#comments").append("<%= escape_javascript( render @comment ) %>")

comments_controller创建操作：

def create
  @comment = Comment.new
  @comment.body = (0...50).map{ ('a'..'z').to_a.<<(" ")[rand(27)] }.join
  @comment.save
end

就这样。现在运行rails s。转到localhost:3000/comments。