的Ajax

Question

我在Rails 4中制作应用程序。我使用简单表格。

我有个人资料模型和资格模型。

协会是：

profile.rb

belongs_to :profile

qualifications.rb

has_many :qualifications

我的个人资料视图中有一个表单，其中包含我的资格视图中的表单的一部分。

型材＃形式

<%= simple_form_for(@profile) do |f| %>
            <%= f.error_notification %>

              <div class="form-inputs">

          <div class="row">

            <div class="intpol2">
              Your professional qualifications
            </div>

              <%= render 'qualifications/form', f: f %>     

          </div>

资格＃形式

<%= simple_fields_for :qualification do |f| %>

  <div class="form-inputs">


    <div class="row">
        <div class="col-md-6">
            <%= f.input :title, :label => "Your award" %> 
        </div>

        <div class="col-md-6">


        </div>


    </div>

    <div class="row">
        <div class="col-md-6">
            <%= f.input :level,   collection: [ "Bachelor's degree", "Master's degree", "Ph.D", "Post Doctoral award"] %>
        </div>


        <div class="col-md-6">
        <%= f.input :year_earned, :label => "When did you graduate?", collection: (Date.today.year - 50)..(Date.today.year) %>
        </div>

  </div>

用户可能拥有多个学位。我想添加一个字段，该按钮表示“添加另一个资格”＆＃39;然后可以使用一组新的资格表格字段。

我发现这篇文章试图做一些稍微不同的事情。我不想要10个空白的表单字段集（这会使表单看起来太长）。

Creating multiple records for a model in a single view in Rails

还有另一种方法可以达到这个目的吗？

Answer 1

好像你必须使用嵌套表单。您必须尝试链接教程，因为我也会使用它。对于另一个教程，您可以将其用作参考nested_forms-rails-4.2。

我希望这对你有所帮助。

Answer 2

你将寻找一个名为cocoon的宝石;您还可以观看this Railscast (Nested forms)这个过时但过时但仍能很好地解释结构的内容。

模式非常简单，但需要一些额外的部分：

有一个调用控制器的ajax按钮

控制器需要返回一个表单并构建fields_for

您将使用JS将新fields_for附加到原始表单

最大的问题是新id的{{1}} - 此模式的新实现使用child_index: Time.now.to_i

我已经写过here。

这是一个新版本：

的Ajax

首先，您需要一个“添加资格”按钮，该按钮通过ajax链接到您的控制器：

fields_for

控制器

这将通过 new 控制器方法，我们应该能够管理该方法以返回ajax请求的特定响应：

#app/views/profiles/_form.html.erb
<%= simple_form_for(@profile) do |f| %>
    <%= f.error_notification %>
    <div class="form-inputs">
       <div class="row">
         <div class="intpol2">Your professional qualifications</div>
         <%= render 'qualifications/form', f: f %>     
       </div>
    </div>
       <%= button_to "+", new_profile_path, method: :get %>
<% end %>

响应

您的#app/controllers/profiles_controller.rb class ProfilesController < ApplicationController respond_to :js, :html, only: :new def new @profile = Profile.new @profile.qualifications.build respond_with @profile #-> will invoke app/views/profiles/new.js.erb end end解雇后，我们需要构建新的HTML表单，解压缩new.js.erb并将其附加到您的视图中：

fields_for

<强> CHILD_INDEX

您还应该更改#app/views/profiles/new.js.erb var fields_for = $("<%=j render "profiles/form" %>").html(); //-> might need tweaking $(fields_for).appendTo("#new_profile.form-inputs");以包含qualifications/form：

child_index

子索引用于表示#app/views/qualifications/form.html.erb <%= simple_fields_for :qualifications, child_index: Time.now.to_i do ...元素的index。在我们的案例中（因为我们正在制作所有新记录），这没关系。使用fields_for每次都会确保完全唯一Time.now.to_i。

最后，你需要确保你正在打电话：

id

... 复数

Rails - 单个属性的多个条目

2 个答案:

的Ajax

控制器

响应