フォームの動的な追加・削除で行が追加されない

Question

nested_fields_for を用いて掲題の
よく見かけるようなフォームの動的な追加・削除を実装しようと試みているのですが
うまく行が追加されません。
ボタンは以下のように表示されています。

エラー自体は出ておらず、私の力ではDebugのしようがなく・・・。
どのあたりに原因がありそうか、どなたかご教授いただけないでしょうか。
以下、コードの一部を記載します。

• 実行時ログ（ADDのボタンを押したとき）

Started GET "/targetservers/new" for XX.XX.XX.XX at YYYY-MM-DD HH:MM:DD +XXXX
Processing by TargetserversController#new as HTML
  Rendering targetservers/new.html.erb within layouts/application
  Rendered targetservers/_form.html.erb (3.8ms)
  Rendered targetservers/new.html.erb within layouts/application (4.7ms)
  Rendered layouts/_shim.html.erb (0.4ms)
  Rendered layouts/_header.html.erb (0.7ms)
Completed 200 OK in 107ms (Views: 104.1ms | ActiveRecord: 0.0ms)

• app/models/targetserver.rb

class Targetserver < ApplicationRecord
  has_many :disks, dependent: :destroy
  accepts_nested_attributes_for :disks, allow_destroy: true
end

• app/models/disk.rb

class Disk < ApplicationRecord
  belongs_to :targetserver, optional: true
end

• app/controllers/targetservers_controller.rb

class TargetserversController < ApplicationController
  before_action :set_targetserver, only: [:show, :edit, :update, :destroy]

  # GET /targetservers
  # GET /targetservers.json
  def index
    @targetservers = Targetserver.all
  end

  # GET /targetservers/1
  # GET /targetservers/1.json
  def show
  end

  # GET /targetservers/new
  def new
    @targetserver = Targetserver.new
    @targetserver.disks.build
  end

  # GET /targetservers/1/edit
  def edit
  end

  # POST /targetservers
  # POST /targetservers.json
  def create
    @targetserver = Targetserver.new(targetserver_params)

    respond_to do |format|
      if @targetserver.save
        format.html { redirect_to @targetserver, notice: 'Targetserver was successfully created.' }
        format.json { render :show, status: :created, location: @targetserver }
      else
        format.html { render :new }
        format.json { render json: @targetserver.errors, status: :unprocessable_entity }
      end
    end
  end

  # PATCH/PUT /targetservers/1
  # PATCH/PUT /targetservers/1.json
  def update
    respond_to do |format|
      if @targetserver.update(targetserver_params)
        format.html { redirect_to @targetserver, notice: 'Targetserver was successfully updated.' }
        format.json { render :show, status: :ok, location: @targetserver }
      else
        format.html { render :edit }
        format.json { render json: @targetserver.errors, status: :unprocessable_entity }
      end
    end
  end

  # DELETE /targetservers/1
  # DELETE /targetservers/1.json
  def destroy
    @targetserver.destroy
    respond_to do |format|
      format.html { redirect_to targetservers_url, notice: 'Targetserver was successfully destroyed.' }
      format.json { head :no_content }
    end
  end

  private
    # Use callbacks to share common setup or constraints between actions.
    def set_targetserver
      @targetserver = Targetserver.find(params[:id])
    end

    # Never trust parameters from the scary internet, only allow the white list through.
    def targetserver_params
      params.require(:targetserver).permit(:hostname, :cpumemory, :os, disks_attributes: [:id, :partitionname, :size, :_destroy])
    end
end

• app/views/targetservers/_form.html.erb

<%= form_with(model: targetserver, local: true) do |form| %>
  <% if targetserver.errors.any? %>
    <div id="error_explanation">
      <h2><%= pluralize(targetserver.errors.count, "error") %> prohibited this targetserver from being saved:</h2>

      <ul>
      <% targetserver.errors.full_messages.each do |message| %>
        <li><%= message %></li>
      <% end %>
      </ul>
    </div>
  <% end %>

  <div class="field">
    <%= form.label :hostname %>
    <%= form.text_field :hostname, id: :targetserver_hostname %>
  </div>

  <div class="field">
    <%= form.label :cpumemory, "CPU & Memory" %>
    <%= form.text_field :cpumemory, id: :targetserver_cpumemory %>
  </div>

  <div class="field">
    <%= form.label :os, "OS" %>
    <%= form.text_field :os, id: :targetserver_os %>
  </div>

  <%= form.nested_fields_for :disks, wrapper_tag: :tr do |disk| %>
    <%= disk.label :partitionname, "Partition Name" %>
    <%= disk.text_field :partitionname, value: "/", :readonly => true %>
    <%= disk.label :size, "Disk Size" %>
    <%= disk.text_field :size %>
    <%= disk.remove_nested_fields_link 'Delete', class: 'btn btn-danger', role: 'button' %>
  <% end %>
  <%= form.add_nested_fields_link :disks, 'Add', class: 'btn btn-primary', role: 'button' %>

  <div class="actions">
    <%= form.submit %>
  </div>
<% end %>

Answer 1

自己解決しました。

As Is)

  <%= form.nested_fields_for :disks, wrapper_tag: :tr |disk| %>

To Be)

  <%= form.nested_fields_for :disks, wrapper_tag: :div do |disk| %>

Answer 2

nested_formを使う場合、フォームの追加・削除はJavaScriptで動きます。app/assets/application.jsに以下の記述が必要です（もしかすると、jQueryの追加の必要もあるかもしれません）。

//= require jquery_nested_form

Comments

[07290729]

maisumakunさん
ご回答ありがとうございます！

# gem list | grep jquery
jquery-rails (4.3.1)
jquery-ui-rails (6.0.1)

# gem list | grep nest
nested_form (0.3.2)
nested_form_fields (0.8.2)

# tail app/assets/javascripts/application.js
// compiled file. JavaScript code in this file should be added after the last require_* statement.
//
// Read Sprockets README (https://github.com/rails/sprockets#sprockets-directives) for details
// about supported directives.
//
//= require rails-ujs
//= require turbolinks
//= require_tree .
//= require nested_form_fields
//= require jquery_nested_form

のような形で追加したのですが、やはりまだできないようです。。。。
jQueryの追加の仕方が間違っているのでしょうか。。。