Question

如何在不使用部分的情况下动态添加/删除表单上的新条目字段。

<%= f.fields_for :list_entries do |list_entry| %>
  <div id="entries">
    <div class="control-group" id="new_entry">
      <%= list_entry.label :description, 'Description:', class: "control-label mandatory_field"%>
      <div class="controls">
        <%= list_entry.text_field(:description, class: "m-wrap col-lg-8")%>
      </div>
    </div>
    <a href="javascript:;" id="addNewEntry">Add Entry</a>
  </div>
<% end %>

...

<script>
    $(document).ready(function(){
       $('#addNewEntry').click(function(){
          $('#entries').append()
       });
          $('#entries').on('click', '#list_entry', function(){
              $(this).closest('.control-group').remove();
          });
    });
</script>

我不确定要添加什么内容。如果我将HTML代码置于追加状态，则fields_for list_entry不会转移。当我使用部分时，发生了同样的事情。我不想使用cocoon gem，因为这是我应用程序的无限小部分。

任何想法......？

Answer 1

我在这里看到两种不同的可能性

您可以使用追加，并执行以下操作 $(object).append("<input name='somename' value='someval'/>")
向服务器发送ajax请求。服务器将使用respond.js.erb之类的视图进行回复，您可以在其中执行以下操作

$(object).append('<%= j(render some_partial_with_field) %>'

在partial部分内，您可以生成所需的任何代码

在表单中附加一个新字段

1 个答案: