ruby-on-rails - 在 click rails 上再添加一组相同的输入

Question

如何为教育对象添加一组相同的输入，以便在提交后有 2 个新的教育对象？需要通过单击现有输入集后面的图标来显示首选的新集。

这是我的新方法:

def new
  @user = User.new
  @user.educations.build
  @user.works.build
end

我的看法:

<%= simple_form_for [:admin, @user] do |u| %>
      <%= u.error_notification %>

      <%= u.input :name, label: "Name" %>
      <p><b>Photo</b></p>
      <%= image_tag(@user.photo_url, size: "80x90",
                    class:"img-rounded") if @user.photo? %>
      <%= u.input :photo, label: false %>
      <%= u.input :tel, label: "Tel.:" %>

      <h3>Education</h3>
      <hr>
      <%= u.simple_fields_for :educations do |e| %>
        <%= e.input :name, label: "University" %>
        <%= e.input :year_started, label: "Started" %>
        <%= e.input :year_finished, label: "Ended" %>
      <% end %>

      # icon `+`
      <i class="fa fa-plus fa-2x"></i>

      <h3>Work</h3>
      <hr>
      <%= u.simple_fields_for :works do |w| %>
        <%= w.input :name, label: "Name" %>
        <%= w.input :year_started, label: "Started" %>
        <%= w.input :year_finished, label: "Ended" %>
      <% end %>


      <%= u.button :submit, "Надіслати" %>
<% end %>

Answer 1

如果你想在调用 new 方法时添加额外的对象，你只需要“构建”更多关联的对象:

def new
  @user = User.new
  2.times do
    @user.educations.build
  end
  @user.works.build
end

这将为您提供两组 education 字段(无需再更改代码)。

---

如果你想在你已经渲染了new方法之后调用额外的对象/字段，你必须动态地完成它，通过，as @Tom Walpole 建议，使用类似 Cocoon 的东西.

有一个过时的，但是good tutorial here .

I've written about it too .

--

动态添加字段依赖于一个简单的模式:

1. Button / Icon press
2. Ajax call to controller
3. Controller builds form with fields_for
4. Ajax response puts new fields_for in DOM

此 (ajax) 与类似“Railscast”(静态)方法的主要区别在于它在 rails 中正确构建了 fields_for。没有黑客工作......

#app/views/admin/users/new.html.erb
<%= link_to fa-icon("plus 2x"), admin_new_user_path, remote: true %>

如果您使用的是 font-awesome，最好使用 font-awesome-rails gem ，当你得到 fa-icon helper 。

#app/controllers/users_controller.rb
class UsersController < ApplicationController
   respond_to :js, :html

   def new
     @user = User.new
     @user.educations.build
     @user.works.build unless request.xhr?
   end
end

#app/views/users/new.js.erb
var form = $("<%=j render 'users/new' ");
$("form#new_admin_user [[fields_for_identifier]]").html($(form).html());

其中的大技巧是 child_index: Time.now.to_i 方法。 “静态”方法的大问题是每个新字段的 id 将与上一个字段完全相同，从而弄乱您的参数:

#app/views/users/new.html.erb
<% if request.xhr? %>
  <%= simple_form_for [:admin, @user] do |u| %>
      <%= u.simple_fields_for :educations, child_index: Time.now.to_i do |e| %>
         <%= e.input :name, label: "University" %>
         <%= e.input :year_started, label: "Started" %>
         <%= e.input :year_finished, label: "Ended" %>
      <% end %>
  <% end %>
<% else %>
   ... your code ...
<% end %>

上述应该工作，但可能需要调整。