Jquery ajax 和 Rails 3 -> 加载内容答案

【问题标题】：Jquery ajax and Rails 3 -> load contentJquery ajax 和 Rails 3 -> 加载内容
【发布时间】：2011-07-14 11:38:15
【问题描述】：

我是 ajax 的初学者。我有一个滑块和一个内容 div，滑块有链接（事件、新闻等），我想创建 ajax 加载到内容 div（如 Facebook）。
我用谷歌，但发现很老的文章（rails 2，但我用 rails3）。
在 Rails 3 教程书中有 jQuery ajax 和 rails3，但它非常小。

我在这一点上：
我使用远程标记 (:remote => true) 设置我的表单，并将 new.html.haml 重命名为 _new.html.haml 部分。我想我必须创建一个 new.js.erb 文件，其中包含：

$(".menuitem").load("<%= escape_javascript(render('article/new')) %>") .content"); //just an idea

我的逻辑对吗？
如果你有关于 Rails 和 ajax 的好教程或示例，请与我分享。

【问题讨论】：

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

【解决方案1】：

您需要为 create.js.erb 或 create.js.haml 创建一个文件，因为这是正在处理的操作。

这里有一个很好的教程：

http://net.tutsplus.com/tutorials/javascript-ajax/using-unobtrusive-javascript-and-ajax-with-rails-3/

注意：文章有一个错误，即对 escape_javascript 的调用将脚本中的 S 大写。

【讨论】：

感谢您的链接！但是，我会更进一步说读者应该通过此处的“安装”说明安装 JQuery gem：github.com/rails/jquery-ujs。此外，在安装 gem 之前，请从 application.rb 文件中删除“config.action_view.javascript...”行，因为 gem 不需要它。

【解决方案2】：

最简单的方法是使用 jQuery 加载您的 .content 元素 onclick：

$(".menuitem").click(function() {
  $(".content").load("/articles/new");
});

并在您的控制器中呈现部分表单：

def new
  render :partial => 'form'
end

【讨论】：

【解决方案3】：

我建议使用jquery_ujs 来处理这个问题。

使用 Rails 3.1+，只需将 gem 'jquery-rails' 添加到您的 gemfile 和 //= require jquery_ujs 在您的 application.js 标头中。

使用:remote => true 设置链接然后将使用Ajax 调用href。

要将博客文章加载到您的 #content div 中，您可以创建一个 show_post.js.erb 来呈现您的文章（假设 show_post 是您使用的操作并且您有一个“_content_post.html.haml”显示博文内容）：

$('#content').html('<%= escape_javascript (render :partial => "content_post") %>')

希望有帮助

【讨论】：