使用nested_forms gem 管理remove_nested_fields按钮上的点击事件

Question

我需要做的只是在每次按下添加按钮时增加"p"标签的值，或者减少按下删除按钮的相同"p"标签的值。

好吧，嵌套表单使用部分来添加新行来管理嵌套表单 de 主窗体视图 这是我的部分代码：

<tr class="fields">
<td>
<%= f.text_field :nombre, class: 'form-control' %>
</td>
<td>
<% 
concat f.select :idtipodocumento, CrTipoDocumento.all.collect 
{|p| [ p.nombre, p.id ] }, {prompt: 'Seleccione el tipo de 
documento'}, :class=>'form-control'
%>
</td>
<td>
<%= f.text_field :documento, class: 'form-control' %>
</td>
<td>
<%= f.link_to_remove raw('<i class="fa fa-minus-circle" aria-
hidden="true"></i>'), :class =>'btn btn-danger' %>
</td>
</tr>

在我的主视图中，y 使用以下代码呈现此部分：

<tbody>
<fieldset id="acreditados">
<%= f.fields_for :cr_acreditados, :wrapper => false %>
</fieldset>
</tbody>

我还有添加按钮来添加新行，效果很好：

<div id="addBtn">
<% if @counter >= 1 %>
<p><%= f.link_to_add raw('<i class="fa fa-plus-circle" aria-
hidden="true"></i>'), :cr_acreditados, id: 'btna', :class => 
'btn btn-primary lta', "data-target" => "#DAC" %></p>
<% else %>
<p class="text-center"><h3>No dispone de mas 
acreditaciones</h3></p>
<% end %>
</div>

而且我每次按下添加按钮或按下删除按钮时都使用 javascript 更新"p 标签"文本，添加按钮的 javascript 效果很好！ 这是代码：

$( document ).ready(function() {
$('.add_nested_fields').click(function(adLine){
var cnt = document.getElementById('acd').innerHTML;
if(cnt <= 1){
if(cnt == 0)
{
alert("You cant add more rows")
adLine.preventDefault();
adLine.stopPropagation();
}
else
{
var res = cnt - 1;
$('#acd').html(res);
}
}
else{
var res = cnt - 1;
$('#acd').html(res);
}
});
});

我希望删除按钮与"p 标签"文本的 +1 相反，问题是，javascript 代码无法检测到新添加的行上的单击事件，但他会在视图加载时检测从数据库中加载数据的行，这是我删除按钮的实际 js 代码：

$( document ).ready(function() {
$('.remove_nested_fields').click(function(remLine){
var cnt = document.getElementById('acd').innerHTML;
cnt = parseInt(cnt,10)
var res = cnt + 1;
$('#acd').html(res);
});
});

Answer 1

SOlved it！ 只需稍微了解一下宝石的官方文档： https://github.com/ryanb/nested_form

他甚至做了一种方法来计算和限制最大字段！ 这是链接： https://github.com/ryanb/nested_form/wiki/How-to:-limit-max-count-of-nested-fields