Question

我正在尝试从嵌套模型rails cast中创建一个复杂的表单。项目和任务是我的两种形式。任务属于项目。项目有很多任务。

我的表单已成功创建，两个模型之间的关系显示正确。我可以销毁项目，它将删除与项目相关的任务。当我尝试使用javascript删除项目并将任务添加到项目时，我的问题就出现了。链接得到成功创建，表单在浏览器中成功加载，我可以提交表单没有问题，但是当我点击“删除”或“添加”链接时没有任何反应。

日志中没有任何内容，浏览器中没有错误消息。这是我的application.js和我的application_helper.js以及表单。

的application.js

//= require jquery
//= require jquery_ujs
//= require jquery.ui.all
//= require_tree .
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({
        before: content.replace(regexp, new_id)
    });
}

application_helper.js

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

_form.html.erb

  <p>
     <%= f.label :name, "Name" %>
     <%= f.text_field :name %> <br />
     <%= f.label :description, "Description" %>
     <%= f.text_field :description %> <br />
     <%= f.label :project_id, "Project ID" %>
     <%= f.text_field :project_id %> <br />
     <%= f.label :id, "ID" %>
     <%= f.text_field :id %>
  </p>

  <h3> Tasks for Project </h3>
    <%= f.fields_for :tasks do |builder| %>
      <%= render 'task', :f => builder %>
    <% end %>
    <p><%= link_to_add_fields "Add Task", f, :tasks %>
    <p><%= f.submit "Submit" %></p>

<% end %>

_task.html.erb

<div class="fields"> 
    <%= f.label :name, "Name" %>
    <%= f.text_field :name %></br >
    <%= f.label :description, "description" %>
    <%= f.text_area :description, :rows => 3 %><br />
    <%= link_to_remove_fields "remove", f %>
</div>

Answer 1

当您使用jquery时，您应该使用parent()而不是up()这是一个原型函数，并将insert()更改为append()。所以你的javascript代码看起来像：

function remove_fields(link) {
  $(link).previous("input[type=hidden]").val(1);
  $(link).parent(".fields").hide();
}
function add_fields(link, association, content) {
  var new_id = new Date().getTime();
  var regexp = new RegExp("new_" + association, "g")
  $(link).parent().append(content.replace(regexp, new_id));
}

但是如果你不想自己编写所有这些杂乱的东西，你可以使用nested_form gem。对于复杂形式来说，这是非常好的宝石。

Answer 2

首先，你忘了结束你的＆lt; p>在link_to_add_fields行

然后，您的jQuery版本可能无法正确执行以下行。

$(link).up().insert({
    before: content.replace(regexp, new_id)
});

为确保没有问题，请尝试在line_to_add_field之前写下此行

并将前3行更改为

$('#task_attributes').append(content.replace(regexp, new_id));

如果这不起作用，请更新您的第一条消息，以显示生成的“link_to_add_field”rails功能代码。

添加删除链接不适用于复杂的嵌套表单

2 个答案: