如何使用带有rails 4.2.2的link_to渲染部分答案

【问题标题】：how to render a partial using link_to with rails 4.2.2如何使用带有rails 4.2.2的link_to渲染部分
【发布时间】：2016-07-08 13:39:30
【问题描述】：

我想让我的用户单击位于其个人资料页面中的“简历”链接，该链接将显示从数据库中提取的他们的简历内容。为此，我创建了部分 lovelies/_bio.html.erb，因为我想在他们的“个人资料页面”上加载“用户简介”，而不是将它们发送到另一个页面。

目前无法找到该部分。这是我下面的代码。

在我的 routes.rb 文件中，我为生物操作创建了一个 url 路径，该路径转换为

    bio_lovely_path url -> /lovelies/:id/bio

这是以这种方式完成的，因为我需要检索我创建为成员的特定用户的信息。

config/routes.rb

resources :lovelies do
  member do
    get 'bio'
  end
 end

我的链接在我的 layouts/_header.html.erb 中

 if logged_in?
  <li class="header-log"><%= link_to "Bio", bio_lovely_path, :remote => true %></li>
else
//display none logged in links
 <%end%>

我有动作的控制器被称为

LovelyController，生物动作定义如下

//显示当前用户简介

    def bio
      @lovely = Lovely.find(params[:id])
      respond_to |format|
       format.js
      end
    end

我的 lovelies.coffee 文件中有一个 jQuery 调用，用于将 lovelies/_bio.html.erb 部分渲染到我的 lovelies/show.html.erb 中的 div

    jQuery ->$('#partial).html '<%= escape_javascript(render 'bio') %>

我的输出显示抛出 500 错误 - 加载资源失败。

我的理解是，jQuery 将该 html 添加到 show.html.erb 中的 <div> 中，将其作为 ruby 处理，并且应该导致 _bio.html.erb 被渲染。我是 Rails 新手，非常感谢有关如何解决此问题的建议和指导。谢谢

【问题讨论】：

标签： jquery html ruby-on-rails ruby ruby-on-rails-4

【解决方案1】：

从链接帮助程序中的:remote => true 来看，听起来您正在尝试做的是在 Rails 中进行 AJAX 调用。你快到了；然而，你并没有完全按照 Rails 的预期去做。

当链接看起来像这样时

= link_to 'Bio', bio_lovely_path(@lovely), :remote => true
# small change from the code you gave - because your path `lovelies/:id/bio` 
# has `:id` in it, you must provide the object you are referring to, `@lovely`.
# in fact, this is probably where your 500 error came from.

被点击，就好像它触发了一个 AJAX 调用，像这样：

// you don't have to write this; `:remote => true` ensures that it gets done 
// for you.
$.ajax({
    url: '/lovelies/<@lovely.id>/bio',
    type: 'get',
    dataType: 'script'
})

这会将您的lovelies#bio 控制器操作作为数据类型js。你在那里做了正确的事情，告诉它respond_tojs 格式。这将允许它渲染一个js 文件。也就是说，在控制器动作结束时，Rails 会寻找对应的js.erb 文件来执行。（通常，它会查找 html.erb 文件，但您已经通过使用 :remote => true 告诉它这次使用 JavaScript。）

app/views/lovelies/bio.js.erb¹

$('#partial').html('<%= escape_javascript(render(partial: "bio.html.erb")).html_safe %>');

以前，您在lovelies.coffee 中大约有此代码，这将不起作用。一方面，Rails 不知道在控制器动作之后执行它。另一方面，assets 文件夹中的文件的 ERB 功能受到限制（尽管它们可以做一些事情，如果你给它们提供 .erb 扩展名）。

¹ 如果您愿意，可以使用 CoffeeScript，.coffee.erb。不过，我不知道具体情况；我尽可能避免使用 CoffeeScript。

现在我已经尝试解释使用 Rails :remote => true 属性时的 AJAX 过程，让我提出一个替代方案。我最近认识到，对于像在页面中插入更多元素这样简单的任务，首先将它们包含在内通常更容易。通过为容器提供display: none CSS 属性来隐藏它们，然后在使用jQuery 的.slideDown() 或类似的东西单击按钮时显示它们。它会让您跳过路由、控制器操作、js.erb 文件以及所有这些麻烦。

基本上，我建议（大多数情况下）将花哨的 AJAX 调用保存在 Rails 中，以供需要删除、创建或更新时使用。当有更简单的方法时，通常不值得为页面动态添加一点额外信息。

【讨论】：

【解决方案2】：

应该在另一个文件中使用render partial: 'name_of_partial' 将部分呈现为不同页面的一部分。但是，您的控制器有一个bio 方法，它需要一个bio.html.erb 文件，以便rails 用于该路径的主要生物页面。请注意文件名开头缺少下划线。

要么使用不同的页面并在其中呈现您的 _bio.html.erb 部分（并且没有单独的路径），要么有一个仅用于个人简介的页面。

【讨论】：

【解决方案3】：

找到一个简单的解决方案

创建一个容器来保存渲染的部分。
使用 Coffeescript 事件来触发要在单击关联 ID 后呈现的部分。

html 文件 - //点击按钮并在页面上显示简介

<button id="display-bio">Lovely Bio </button>

//在页面上显示bio的div

<div id="bio" style='display:none'>
    <%= render 'layouts/bio'%>
</div>

咖啡脚本中的代码

//咖啡脚本中触发事件的代码

$('#display-bio).click ->
    $('#bio).show()

我认为这很简单。

【讨论】：