almost 4 years ago

nested form可以將有關聯的model attribute放在同一個form裡面一起建立或更新
例如這次的實作是一個商品有很多種規格,我希望在新增商品的時候就可以同時新增完規格(product has_many specs)

Model如下:

model/product.rb
class Product < ActiveRecord::Base
  has_many :specs, :dependent => :destroy
  accepts_nested_attributes_for :specs # 加上這行讓rails可以知道specs是nested attributes

end
model/spec.rb
class Spec < ActiveRecord::Base
  belongs_to :product
end

如此一來後端的設定就算是OK了,接下來是前端form的部分,在此用simple_form作為例子,rails guide內也有原生form的教學可以參考此連結

如果是用simple_form就是使用simple_field_for的這個helper即可

view/admin/products/_form.html.erb
<%= simple_form_for [:admin, @product] do |f|  %>
  <%= f.input :name, :required => true %>
  <%= f.input :description, :required => true %>
  <%= f.input :price %>

  <!-- nested form從這裡開始 -->
  <%= f.simple_fields_for :specs do |spec| %>
    <%= spec.input :name %> <!-- spec的name欄位 -->
    <%= spec.input :detail %> <!-- spec的detail欄位 -->
  <% end %>
  <!-- nested form結束 -->
  
  <%= f.button :submit, "Submit", :disable_with => "Submiting..." %>
<% end %>

這樣就完成了最簡單的nested form囉~!

同場加映:動態新增表單的GEM -- cocoon

官方網址:https://github.com/nathanvda/cocoon
簡易說明:
有時候我們會需要動態新增表單欄位,比如說我希望可以同時新增很多simple_field_for :specs 的表單,讓使用者可以新增或是刪除表格,實作原理是用javascript動態生成表單,基本上只要按照官網的說明做就可以了,有空再寫筆記:)

參考資料:
http://www.createdbypete.com/articles/working-with-nested-forms-and-a-many-to-many-association-in-rails-4/
http://iroller.ru/blog/2013/10/14/nested-model-form-in-rails-4/

← Polymorphic Associations [Rails Gem] Backround running →
 
comments powered by Disqus