Question

我使用的是nested_form gem，允许用户动态添加和删除表单字段。它工作正常，但我希望能够阻止用户删除第一个file_field，并且只显示“删除”链接（如果它是用户添加的字段）。我的'_form'和'_photo_fields'部分在下面。我认为解决方案是做一些类似的事情，“如果这个字段不是页面上它的第一个字段，那么，显示'删除'链接，”但我不知道如何实现这一点。感谢您提供的任何见解。

_form.html.erb：

<%= simple_nested_form_for @service_offering do |f|%>

... Other Fields ...

<%= f.fields_for :photos do |builder| %>
    <%= render 'photo_fields', :f => builder %>
<%end%>

<%= f.button :submit %>

<p><%= f.link_to_add "Add Photo", :photos %></p>

_photo_fields.html.erb：

<% if f.object.new_record? %>

<%= f.label :photo %>  
<%= f.file_field :photo %>
# This is where I want to drop that if statement, but I am not sure what it should be.
<%= f.link_to_remove "Remove" %>
#
<%end%>

<% unless f.object.new_record? %>

<%= link_to( image_tag(f.object.photo.url(:thumb))) %>
<%= f.check_box :_destroy %>
<%= f.label :_destroy, "Remove" %>

<%end%>

Answer 1

您无法在视图中将其隐藏在ERB中，因为在fields_for块中呈现的内容随后将用作“添加新”按钮的模板。因此，如果你隐藏删除链接，那么没有任何添加项目会删除链接。

当我查看nested_form_for代码时，它没有本机支持。最简单的解决方案，但不理想，是通过CSS或JS隐藏客户端上的删除链接。

我用这个JS解决了它：

$(function() {
  $('a[data-nested-form-disable-first]').each(function() {
    var nested_container = $(this).closest('.fields');

    // check if is first
    if (!nested_container.prev().is('.fields')) {
        $(this).remove();
    }
  });
});

然后添加'data-nested-form-disable-first'以删除链接定义：

<%= f.link_to_remove 'Remove', 'data-nested-form-disable-first' => '' %>

仅当您确保加载时页面中存在不可移动字段时才有效。

Answer 2

我在这里看到两个选项：

如果可以询问您的照片是否可以删除，那将是最简单的解决方案
您可以尝试通过CSS隐藏表单中的链接。

Photo API

尝试通过

class Photo ...
  def removable?
    ...
  end
end

<强> _photo_fields.html.erb：

...
<%= f.file_field :photo %>
<% if f.object.photo.removable? %>
  <%= f.link_to_remove "Remove" %>
<% end %>

使用CSS

我不确定，但应该可以通过：

为您的照片字段添加div
向您的CSS添加相关规则。

所以这是代码（只有您应该更改或添加的片段：

<强> _photo_fields.html.erb：

<div class="photo_fields">
   ...
   <%= f.link_to_remove "Remove", :class => "remove" %>
   ...
</div>

<强> application.css：

div.photo_field:first-child > a.remove {
  display: none;
}

如果可能的话，第一个解决方案是正确的，因为它根本不允许删除不可移除的东西。第二个是隐藏链接的解决方法，但要弱得多。

如果表单字段是具有Nested_Form gem的页面上的第一个表单字段，如何删除“删除”链接？

2 个答案:

Photo API

使用CSS