Question

我尝试使用rails 5和jQuery创建一个动态的嵌套表单。我可以轻松删除嵌套字段，但很难将它们添加回来。我的_project_field.html.erb如下：

<%= form_for @project do |project| %>      

  <%= project.label :description, class: 'col-md-2' %>
  <%= project.text_field :description, class: 'col-md-8' %>

  <%= project.label :lot, class: 'col-md-2' %>
  <%= project.text_field :lot, class: 'col-md-8' %>

  <%= project.fields_for :tests do |test| %>
    <%= render 'test_fields', :f => test %>
  <% end %>

  <%= link_to "Add Test", 'javascript:void(0);',  class: "add-link col-md-2" %>

  <%= project.hidden_field :user_id, value: current_user.id %>
  <%= project.submit "Submit", class: 'btn btn-primary col-md-2 col-md-offset-3' %>

<% end %>

，其中包含_test_fields表格，

<div class="form-fields">
  <div class="row">

    <%= f.label :test_method_id, "Test Method", class: 'col-md-2' %>

    <div class="col-md-6 method-select">
      <%= f.select(:test_method_id, options_for_select(@methods, selected: f.object.test_method_id), include_blank: true) %>
    </div>

    <%= link_to "Remove", 'javascript:void(0);',  class: "remove-link col-md-2" %>

  </div>
</div>

当我点击＆＃34;添加测试＆＃34;链接，它只是呈现字符串＆＃34;＆lt;％= j render＆＃39; test_fields＆＃39;，：f =＆gt; test％＆gt;＆＃34;。这是代码：

//  assets/javascript/forms.js

$(".add-link").click(function() {
  console.log("add link");
  var html = '<%= j render \'test_fields\', :f => test %>'
  $(this).parent().append(html);
})

如何将字段partials添加到嵌套表单？

Answer 1

JavaScript代码正在按照它应有的方式完成工作。这不起作用的原因是因为您试图在浏览器中解释ERB代码。

form.js文件已在浏览器中加载。但是'<%= j render \'test_fields\', :f => test %>'是要在服务器中解释的ERB代码。

因此，要使其成为动态表单，您需要：

在projects_controller中创建一个与#add_form_field类似的操作也许
在routes.rb中为操作定义必要的路线。哪个会最多可能会给你一个像project_add_form_field_path
您将在链接中使用此路径。即，而不是

<%= link_to "Add Test", 'javascript:void(0);', class: "add-link col-md-2" %>

你会有类似的东西：

<%= link_to "Add Test", project_add_form_field_path, class: "add-link col-md-2", remote: true %>
这将调用你的#add_form_field动作 projects_controller。 remote: true将使其异步这样你的页面当然不会重新加载。
所以现在控制器动作将在中查找相关文件 views文件夹。由于它是一个异步调用，它将会发生寻找JavaScript文件：/views/project/add_form_field.js.erb。您将要将JavaScript放入form.js文件中这个add_form_file.js.erb文件。现在'<%= j render \'test_fields\', :f => test %>'位将被处理服务器和东西应该按照你的意愿工作。

同样在JavaScript中，我更倾向于"<%= j render 'test_fields', :f => test %>"使用转义字符。

在Rails中通过jQuery渲染表单

1 个答案: