Rails - dynamically embeds nested object inside partial nested objects (Cocoon)

I am currently creating a mid-level blog service where users can add article elements (text, image, YouTube, etc.) that combine the body of the article.

The article model has many ArticlePart models and dynamically creates a nested form, I am using a cocoon gem. Here is my current code.

_form.html.erb

<%= link_to_add_association("Add New Article Part", f, :article_parts,{:data => {"association-insertion-node" => "#article" }}) %>
 <ul class="sortable">
  <div id="article">
   <%= f.fields_for :article_parts  %>
  </div>
 </ul>

      

        
        
        
      

    

_article_part_fields.html.erb

<li class="nested-fields">
 <h2>Text Part</h2>
 <%= f.hidden_field :position %>
 <%= f.label :title %>
 <%= f.text_field :title %>
 <%= link_to_remove_association("Delete part", f) %>
 <h2>Insert New Article Part Here</h2>
</li>

      

        
        
        
      

    

The above works great, but I want to show "link_to_add_association" where "Insert New Article Part Here" is blocked in _article_part_fields.html.erb so that users can add new article part wherever they want.

I tried to do it as shown below by passing the parent object form to the nested object form, but this code throws a stack level error too deep.

<li class="nested-fields">
 <h2>Text Parts</h2>
 <%= f.hidden_field :position, :class => "position" %>
 <%= f.label :title %>
 <%= f.text_field :title, :class => "fld-name required" %>
 <%= link_to_remove_association("Delete part", f) %>
 <h2>Insert New Part Here</h2>
 <%= link_to_add_association("商品", parent_form, :article_parts,{:render_options => {:locals => {:parent_form => parent_form}}, :data => {"association-insertion-node" => "#article" }}, :class => 'btn btn-ctrl btn-lg') %>
</li>

      

        
        
        
      

    

Any help is appreciated to get this to work, or suggest another way to achieve this.

Thanks in advance!