Question

我想要一个按钮，每次点击它时都会呈现一个新的嵌套表单。为此，我使用了JQuery并使用了Rails 3.2

在另一个线程上有人说使用ajax调用“onclick正在浏览器中执行，所以你不能在其中使用erb。你会想要进行ajax调用（.load是一个方便的快捷方式）到服务器，你可以使用erb渲染部分，以获得你需要返回的html。“

这是我的html.erb表单，在Jquery点击时插入的表单partial是一行，还有JQuery。新成员的html正确呈现，但部分呈现就好像它只是一个字符串。

有谁知道如何进行ajax调用来渲染部分或者我是否应该？

<h1>New Member</h1><%=render'new_user')%>

new.html.erb

<%= form_for(@family) do |f| %>
  <form class = 'form-horizontal' role = 'form'>
    <div class='form-group'>
      <%= f.label :name %>
      <%= f.text_field :name, placeholder: @family.name %>
    </div>
    <button type="button" id="add-family-button" class="btn btn-warning">Add to your table</button>
    <div id="child-forms-div" class='form-group'>
    </div>
    <div class='actions'>
      <%= f.submit %>
    </div>
  </form>
<% end %>

_new_user.html.erb

这实际上是在一行中但我无法在堆栈溢出时将其格式化为

<div class='form-group col-xs-3'>
  <%= f.fields_for :users, @new_user do |ff| %>
    <%= label_tag :first_name %>
    <%= ff.text_field :first_name, placeholder: 'First Name' %>
    <%= label_tag :last_name %>
    <%= ff.text_field :last_name, placeholder: 'Last Name' %>
  <% end %>
</div>

javascript.js

$("#add-family-button").click(function(){
  var form = "<h1>New Member</h1><%=render'new_user')%>";
  $("#child-forms-div").append(form);
});

Answer 1

为了能够动态生成嵌套表单，您可以使用ajax或javascript和一些辅助方法。

这个过程在这里演变的轨道中得到了很好的解释 - rails cast link

使用Jquery追加单击时单击渲染

new.html.erb

_new_user.html.erb

javascript.js

1 个答案: