Ytukyg

I am able to generate the required layout for nested attribute form like the below image:

The code for nested form:

f.inputs 'Line Item/s' do

    f.has_many :payment_line_items, heading: false do |form|

      table do

        tr do

          th 'Description'

          th 'Qty'

          th 'Unit Price'

          th 'Amount'

        end

        tr do

          td {form.input :description, label: false}

          td {form.input :quantity, label: false}

          td {form.input :unit_price, label: false}

          td {form.input :amount, label: false}

        end

      end

    end

  end

When I click on 'add new payment line Item button' I get something like this image:

I just want to duplicate the whole table or just the tr with the form part when I click on 'add new payment line Item' button. How can I accomplish this ?

I had a similar issue in one of my activeadmin projects. The fieldset element uses li elements that you can style. So check the class the form is using, and than add something like this to the end of app/assets/stylesheets/active_admin.scss. Here I assume the css class on the surrounding form is line_items. The trick is the inline-block property on the li element, you may have to fiddle with the css properties though.

form.line_items fieldset.has_many_fields ol > li > label { display: none; }

form.line_items fieldset.has_many_fields:first-child ol > li > label { display: block; }

form.line_items fieldset.has_many_fields ol > li { display: inline-block; padding: 5px; width: 18%; float:left;}

form.line_items fieldset.has_many_fields ol > li.has_many_delete { margin-top:20px; margin-left: -36px;}

form.line_items fieldset.has_many_fields ol > li > label { width: auto; padding-right: 10px;}

form.line_items fieldset.has_many_fields ol > li > div > label.label { width: auto; padding-right: 10px;}

form.line_items fieldset.has_many_fields ol > li > a.has_many_remove { margin-top:20px; }

form.line_items fieldset.has_many_fields ol > li > p.inline-errors { margin: 0.3em 0 0 0; }

This would work but you will have to rewrite the form to:

  f.inputs 'Line Item/s' do

    f.has_many :payment_line_items, heading: false do |form|

      form.input :description, label: false

      form.input :quantity, label: false

      form.input :unit_price, label: false

      form.input :amount, label: false                    

    end

  end

If you want the user to be able to destroy line items you will have to set up your assocations and the permit_params for it like so:

In your model

accepts_nested_attributes_for :line_items, :allow_destroy => true

And in the activeadmin register block:

permit_params 

  :line_items_attributes => [:id, :description, :quantity, :unit_price, :amount, :_destroy]

Good luck!