title: Issues with nested forms
body: <p>I'm trying to create a fully manageable website where the user can fill some skills ('css', 'php', 'ruby', you name it). Next to it, they fill how good they think they are with this, in a percentage.</p>
  
  <p>I intend to display the result in graphs but right now I'm stuck with this nested form, I can't make them show up.</p>
  
  <p>So as I said earlier, you can add your skills in a page named settings, so here is how I linked them together:</p>
  
  <p><strong>skill.rb and setting.rb</strong></p>
  
  <pre><code>class Skill &lt; ApplicationRecord
    belongs_to :settings, optional: true
  end
  
  class Setting &lt; ApplicationRecord
      has_many :skills, dependent: :destroy
        accepts_nested_attributes_for :skills, allow_destroy: true, 
        reject_if: proc { |att| att['name'].blank? }
  # Other lines...
  </code></pre>
  
  <p><strong>ApplicationHelper.rb</strong></p>
  
  <pre><code>def link_to_add_row(name, f, association, **args)
      new_object = f.object.send(association).klass.new
      id = new_object.object_id
      fields = f.fields_for(association, new_object, child_index: id) do |builder|
        render(association.to_s.singularize, f: builder)
      end
      link_to name, '#', class: 'add_fields' + args[:class], data: { id: id, fields: fields.gsub('\n', '') }
    end
  </code></pre>
  
  <p><strong>application.js</strong></p>
  
  <pre><code>$(document).on('turbolinks:load', function() {
  
      $('form').on('click', '.remove_skill', function(event) {
          $(this).prev('input[type="hidden"]').val('1');
          $(this).closest('div').hide();
          return event.preventDefault();
      });
  
      $('form').on('click', '.add_fields', function(event) {
         let regexp, time;
         time = new Date().getTime();
         regexp = new RegExp($(this).data('id'), 'g');
         $('.skills').append($(this).data('skills').replace(regexp, time));
         return event.preventDefault();
      });
  });
  </code></pre>
  
  <p><strong>views/settings/_form.html.erb</strong></p>
  
  <pre><code>  &lt;!-- Some other fields --&gt;
    &lt;table&gt;
      &lt;thead&gt;
        &lt;tr&gt;
          &lt;th&gt;&lt;/th&gt;
          &lt;th&gt;Compétence&lt;/th&gt;
          &lt;th&gt;Maîtrise&lt;/th&gt;
        &lt;/tr&gt;
      &lt;/thead&gt;
      &lt;tbody class="fields"&gt;
        &lt;%= fields_for :skills do |builder| %&gt;
          &lt;%= render 'skill', f: builder %&gt;
        &lt;% end %&gt;
  
        &lt;%= link_to_add_row('Ajouter skill', f, :skills, class: 'add_skill') %&gt;
  
      &lt;/tbody&gt;
    &lt;/table&gt;
    &lt;!-- Some other fields --&gt;
  </code></pre>
  
  <p>**views/settings/_skill.html.erb</p>
  
  <pre><code>&lt;tr&gt;
    &lt;td&gt;
      &lt;%= f.input_field :_destroy, as: :hidden %&gt;
      &lt;%= link_to 'Delete', '#', class: 'remove_record' %&gt;
    &lt;/td&gt;
    &lt;td&gt;&lt;%= f.input :name, label: false %&gt;&lt;/td&gt;
    &lt;td&gt;&lt;%= f.input :completed, label: false %&gt;&lt;/td&gt;
    &lt;td&gt;&lt;%= f.input :due, label: false, as: :string %&gt;&lt;/td&gt;
  &lt;/tr&gt;
  </code></pre>
  
  <p>I followed <a href="https://www.youtube.com/watch?v=pulzZxPkgmE" rel="nofollow noreferrer">this video</a>'s instruction, and so far when I click on "add skill", I can see my nested form being rendered in my rails console, but that's all.</p>
  
  <p>I think this is just something I didn't see, but I redid the tutorial twice and each time a bit different but nothing shows when i click on "add skill".</p>
  
  <p>Any help is welcomed!</p>