任意次數動態添加和刪除表單的新但相同的字段

Question

我有一個沒有嵌套模型的表單。

class UserProductsController

  def new
    @user_product = current_user.user_products.build
  end
end

使用 jquery/javascript 我想在同一個表單上添加和刪除新的 @user_product 字段。 這是它正常的樣子：

<%= form_for(@user_product) do |f| %>
    <%= f.error_messages %>
      <%= f.text_field :product %>
      <%= f.text_field :address %>
      <%= f.text_field :price %>
    <%= f.submit %>
<% end %>

我正在努力實現：

<%= form_for(@user_product) do |f| %>
      <%= f.error_messages %>
      <%= f.text_field :product_name %>
      <%= f.text_field :address %>
      <%= f.text_field :price %>
      ---New ID(New generated ID, could be any new number in the database)
      <%= f.text_field :product_name %>
      <%= f.text_field :address %>
      <%= f.text_field :price %>
      <%= Remove this Product %> # ajax style, this link removes this product entirely
      ----ID 3----
      <%= f.text_field :product_name %>
      <%= f.text_field :address %>
      <%= f.text_field :price %>
      <%= Remove this Product %>
     -----Add link------
      <%= Add Another Field %> # ajax style adding
   <%= f.submit %>
<% end %>

請注意未預設的新 ID 和一個提交按鈕，這樣用戶一次可以創建多個產品。 我如何實現上述目標？

謝謝你。

---

回答：

使用 User.rb model 你可以按照詹姆斯所說的去做。 這是我的有效表格。

<%= form_for(current_user, :url => user_products_path) do |f| %>
  <%= f.error_messages %>
    <%= f.fields_for :user_products do |builder| %>
     <%= render "user_product_fields", :f => builder %>
    <% end %>
     <%= link_to_add_fields "Add a UserProduct", f, :user_products %>
    <%= f.submit "Create" %>
<% end %>

_user_product_fields.html.erb

<div class="fields">
        <%= f.label :product, "Product" %>
        <%= f.text_field :product %>
        <%= f.label :address, "Address" %>
        <%= f.text_field :address %>
        <%= f.label :price %>
        <%= f.text_field :price %>
        <%= link_to_remove_fields "remove", f %>
</div>

Answer 1

正如其他人所建議的（有點無益），使用嵌套的 forms。

您需要該表單基於 current_user object 和 fields_for 聲明：user_products。 You will need to set the url for the form to post back to the user_product controller not the user controller using url_for and you will need to adjust the user_product controllers update and create actions to make use of params[:user] instead of params[:用戶產品]

如果您正確配置了accepts_nested_attributes，那么一切都應該很好。

順便說一句，如果您遵循這些 railscasts，您會發現添加新的 javascript 不適用於 Rails 3.x

你應該為你的視圖助手使用這樣的東西

module ApplicationHelper
  def link_to_remove_fields(name, f)
    f.hidden_field(:_destroy) + link_to_function(name, "remove_fields(this)")
  end

  def link_to_add_fields(name, f, association)
    new_object = f.object.class.reflect_on_association(association).klass.new
    fields = f.fields_for(association, new_object, :child_index => "new_#{association}") do |builder|
      render(association.to_s.singularize + "_fields", :f => builder)
    end
    link_to_function(name, "add_fields(this, '#{association}', '#{escape_javascript(fields)}')")
  end
end

和 application.js 文件中的 javascript 類似的東西

// Place your application-specific JavaScript functions and classes here
// This file is automatically included by javascript_include_tag :defaults
function remove_fields(link) {
  $(link).previous("input[type=hidden]").value = "1";
  $(link).up(".fields").hide();
}

function add_fields(link, association, content) {
  var new_id = new Date().getTime();
  var regexp = new RegExp("new_" + association, "g")
  $(link).up().insert({
    after: content.replace(regexp, new_id)
  });
}

顯然你的 form_for 需要重構為這樣的東西

<%= form_for(current_user, :url => user_product_path) do |f| %>
<!-- add your f.fields_for :user_products here, probably in a rendered partial -->
<%end%>

這應該足以讓你繼續前進

Answer 2

簽出這個：

http://railscasts.com/episodes/196-nested-model-form-part-1

http://railscasts.com/episodes/197-nested-model-form-part-2

Answer 3

您可以為此使用繭。