单击时渲染带有jquery的rails部分

Question

我有一个允许用户构建简历的应用程序。 目前，我有一个表单（Resume），可以为我的其他每个模型（教育，体验等）加载嵌套表单。 默认情况下，这些部分是可见的。 我希望用户能够单击要添加的部分（例如，他们将从列表中单击“教育”，并会附加教育表格块），而不是默认情况下不显示表格。 jQuery的。 在我的表单中，制作了一个带有“ form-b​​lock-section”类的div，然后将每个单独的表单块移动到了自己的部分中。

# _form.html.erb

<%= form_for(@resume) do |f| %>
  <% if @resume.errors.any? %>
   <div id="error_explanation">
    <h2><%= pluralize(@resume.errors.count, "error") %> prohibited this resume from being saved:</h2>

    <ul>
      <% @resume.errors.full_messages.each do |message| %>
        <li><%= message %></li>
      <% end %>
    </ul>
   </div>
  <% end %>

  <div class="field">
    <%= f.text_field :title, class: "form-control", placeholder: "Title" %>
  </div>
  <div class="field">
    <%= f.text_area :summary, class: "form-control", placeholder: "Summary" %>
  </div>
  <div class="field">
    <%= f.text_field :job_title, class: "form-control", placeholder: "Desired Job Title" %>
  </div>

  <div class="form-block-section">

     *****
     // THIS IS WHERE I WANT THE FORM BLOCKS TO BE APPENDED WHEN THE USER CLICKS THE LINK

  </div>

  <div class="actions">
    <%= f.submit %>
  </div>
<% end %>

就像我说的那样，我为用户可以选择的每个简历部分创建了一个局部。 这是一个例子。

# _education_block.html.erb

<div id="educations" class="field build-block">
   <h3>Education</h3>
   <%= f.fields_for :educations do |education| %>
   <% end %>
   <div class="links">
     <%= link_to_add_association 'add education', f, :educations %>
   </div>
</div>

在我的resumes.js中

# resumes.js

$('#add-education-block').on('click', function(){
    $('.form-block-section').append("<%= escape_javascript(\"#{render 'education_block'}\").html_safe %>");
});

现在的问题：

它以字符串形式呈现在我的页面上：<％= escape_javascript（“＃{render'education_block'}”）。html_safe％>

Answer 1

您需要将.erb添加到resume.js-resume.js.erb。

此外，您可能想使用嵌套表单-https: //github.com/ryanb/nested_form