Rails - fields_for和javascript，用于动态添加和删除表单中的字段(railscasts ep.

Question

>UPDATE

谢谢你的回答。

但是如果我删除

for requested_role in @project.requested_roles

从部分，那么我无法访问 requested_role.role 值，因为我没有从代码中获得的参数 X

for X in @projects.requested_roles 

我不能写X.role

如何在不使用 for 或 .each 滚动项目requested_roles的情况下访问此值？

结束更新

---

我正在使用Ruby on Rails开发的社交网络出现问题。我按照 railscasts 196 和 197 创建了一个带有 fields_for 的表单，并使用 javascript 动态添加字段，但我有 2 个主要问题。

用户可以创建一个项目，并且此项目必须具有 1+ Requested_roles。当我打开项目编辑页面以更改角色时，如果项目有 N 个requested_roles，我会看到 N*N 个表单来更改requested_roles。因此，如果我有 2 个requested_roles(例如导演和制片人(，我会看到 4 个选择字段，导演 - 制片人 - 导演 - 制片人。它们重复N次。而且我无法修改它们，因为我每种类型最多可以有 1 requested_role。如果我只有 1 requested_role也没关系(因为 1x1=1(

项目.rb

class Project < ActiveRecord::Base
attr_accessible :title, :requested_roles_attributes, :video, :num_followers, :num_likes
belongs_to :user
has_many :requested_roles, dependent: :destroy
accepts_nested_attributes_for :requested_roles, :reject_if => lambda { |a| a[:ruolo].blank? }, :allow_destroy => true

Requested_role.rb

class RequestedRole < ActiveRecord::Base
attr_accessible :role, :project_id 
belongs_to :project

Projects_controller.rb

class ProjectsController < ApplicationController
def new
  @project= Project.new
  @requested_role= @project.requested_roles.build    
end   

项目/编辑.html.erb

<div class="row">
 <div class="span6 offset3">
  <%= form_for(@project) do |f| %>
    <%= render 'shared/error_messages', object: f.object%> 
    <%= f.label :title, "Project title" %>
    <%= f.text_field :title %>
    <%= f.fields_for :requested_roles do |builder| %>
          ciao
         <%= render 'requested_role', :f => builder   %>
    <% end %>
    <div class="fields">
    <p><%= link_to_add_fields "Add requested role", f, :requested_roles %></p>
    </div>
    </br>
    <%= f.submit 'Apply changes', class: 'btn btn-large btn-primary' %>
  <% end %>
</div>
</div>

我认为错误出在此视图中(项目/编辑(：

    <%= f.fields_for :requested_roles do |builder| %>
          ciao
         <%= render 'requested_role', :f => builder   %>
    <% end %>

即使没有部分代码，也会导致 N 次重复requested_roles。事实上，如果没有部分_requested_role，我们有N个"ciao"，但我们应该只有一个。

项目/_requested_role.html.erb

<% if @project.requested_roles.any? %>
    <p>Modifica ruoli richiesti </p>
<%end%>
<%= @project.requested_roles.count %>
<% for requested_role in @project.requested_roles %>
    <div class="fields">
    <p>
    <p>Requested role: <%= role_to_string(requested_role.role) %></p>
    <%= f.label :role, "Modify role" %>
    <%= f.select :role, options_for_select([["Regista",1],["Sceneggiatore", 2],["Direttore della fotografia", 3], ["Operatore",4],
                                      ["Fonico", 5], ["Montatore", 6], ["Truccatrice",7], ["Costumista",8], ["VFX Artist",9],
                                      ["Produttore", 10], ["Attore",11], ["Attrice",12], ["Grip/Runner",13]], :selected => requested_role.role) %>

    <%= link_to_remove_fields "remove", f %>    #dinamically remove a field
    </p>
<% end %>
</div>

你能帮我吗？我无法弄清楚错误在哪里。提前谢谢你。

另一个问题与动态删除和添加requested_roles的链接(javascript-jquery(有关。

如果我有 3 个requested_roles(由于我之前提到的错误，9 个选择字段而不是 3 个(并且我删除(通过 link_to_remove_fields(最后一个，则没有问题。但是，如果我删除第一个，字段甚至它下面的提交按钮都会消失，我无法修改角色或提交更改。

当我添加(通过link_to_add_fields(一个新角色并且我已经有，例如，2 requested_roles(导演、制片人(时，当我单击链接添加新requested_role时，会出现另一个错误。显示的不是用于选择角色的选择字段，而是 2 个现有选择字段(导演、制片人(的副本。

application_helper.rb

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, :f => builder)
  end
  link_to_function(name, "add_fields(this, "#{association}", "#{escape_javascript(fields)}")")
end

应用.js

function remove_fields(link) {
    $(link).prev("input[type=hidden]").val("1");
    $(link).closest(".fields").hide();
}

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

我不明白出了什么问题。如果你有一些想法，你能给我一些建议吗？谢谢。

达里奥

Answer 1

问题是你迭代了两次。

<%= f.fields_for :requested_roles do |builder| %>
  ciao
  <%= render 'requested_role', :f => builder   %>
<% end %>

将自动为每个请求的角色重复requested_role部分。这就是为什么它显示"ciao"N次，因为这就是fields_for渲染时所做的。您可能需要阅读文档以了解其工作原理：http://api.rubyonrails.org/classes/ActionView/Helpers/FormHelper.html#method-i-fields_for

所以没有必要有

for requested_role in @project.requested_roles

在你的部分。它只会在每次呈现它时重复所有请求的角色fields_for。以下是您的代码在edit.html.erb中的样子：

<% if @project.requested_roles.any? %>
  <p>Modifica ruoli richiesti </p>
<%end%>
<%= @project.requested_roles.count %>
<%= f.fields_for :requested_roles do |builder| %>
   <%= render 'requested_role', :f => builder   %>
<% end %>
<p><%= link_to_add_fields "Add requested role", f, :requested_roles %></p>

部分requested_role应该只是：

<div class="fields">
  <div>
    <p>Requested role: <%= role_to_string(f.object.role) %></p>
    <%= f.label :role, "Modify role" %>
    <%= f.select :role, options_for_select([["Regista",1],["Sceneggiatore", 2],["Direttore della fotografia", 3], ["Operatore",4],
                                  ["Fonico", 5], ["Montatore", 6], ["Truccatrice",7], ["Costumista",8], ["VFX Artist",9],
                                  ["Produttore", 10], ["Attore",11], ["Attrice",12], ["Grip/Runner",13]], :selected => f.object.role) %>

    <%= link_to_remove_fields "remove", f %>
  </div>
</div>

修复您的部分应该可以解决链接的第二个问题。

您可能需要考虑使用 Ryan's gem 进行nested_forms

https://github.com/ryanb/nested_form