在 Ruby on Rails 中通过 ajax 渲染部分视图答案

【问题标题】：Render a partial view via ajax in Ruby on Rails在 Ruby on Rails 中通过 ajax 渲染部分视图
【发布时间】：2014-03-01 18:12:09
【问题描述】：

目前我正在尝试使我的 Rails 应用程序单页，但我在渲染局部时遇到了一些问题。现在这是我的控制器代码：

class WelcomeController < ApplicationController

    def create
        @welcome = WelcomeController.new
        render :partial => 'enjoy'
    end

    def index
        if params[:id] == 'enjoy'
            @partial_view = 'enjoy'
        elsif params[:id] == 'about'
            @partial_view = 'about'
        else
            @partial_view = 'main'
        end
    end

end

所以这个控制器链接到我的视图，为了改变页面，我在索引操作中使用了代码，但现在我试图在创建操作中使用这个东西。我试图调用创建操作的 index.html.slim 的代码是：

        div id="content"

        = form_tag(:url => {:action => 'create'},
                :update => "content", :position => :bottom,
                :html => {:id => 'subject_form'}, 
                :remote => true)

            = submit_tag 'Add'

所以在按钮单击“添加”时，我期待来自 _enjoy.slim.html 的内容，这是我进入 id 为“内容”的 div 的部分内容，但是当单击按钮和 _enjoy.html 时。 slim 被渲染它加载在整个 index.html.slim 页面的顶部......所以我被困在了那个，我怎样才能让它加载到某个 div 中？

非常感谢任何对此问题有答案的人{：

【问题讨论】：

你运行的是哪个版本的rails？

标签： ruby-on-rails ajax render single-page-application rails-routing

【解决方案1】：

控制器：

class WelcomeController < ApplicationController

  def create
    @welcome = WelcomeController.new
    # Remove the render
  end

  def index
    # No change
  end    
end

查看：

div id="content"

= form_tag({:action => 'create'}, :id => 'subject_form',  :remote => true) do
  = submit_tag 'Add'

创建welcome/create.js.erb 并向其中添加以下行：

$('#content').html("<%= j render(:partial => 'welcome/enjoy') %>")

【讨论】：

非常感谢！
也许吧？尝试将文件重命名为 create.js.slim。您必须将内容更改为：$('#content').html("#{ j render(:partial => 'welcome/enjoy') }")
嗯.. 为什么是 #{ j renderer... 而不是 ={ j renderer.. ?
因为#{}用于slim中的文本插值。

【解决方案2】：

您必须在“欢迎”视图目录中添加一个 create.js.erb 文件，并且您必须在其中渲染每个 ajax 的部分内容：

$("#content").html("<%= j render(:partial => 'welcome/enjoy') %>");

并且在控制器的创建动作中你必须响应 javascript：

def create
 ...
 respond_to do |format|
   format.js
 end
end

【讨论】：