在设计中创建动态添加用户表单

Question

我在我的 rails 3.2 应用程序中使用 devise。

我有一个用户/新页面，管理员用户在其中填写电子邮件地址，然后使用随机密码创建用户。

这一切都很好。

我想做的是创建一个动态表单，以便管理员可以创建任意数量的用户。应该有一个“添加用户字段”按钮和一个“删除用户字段”按钮，允许为用户生成新字段。

我似乎无法让 jquery 使用该表单。

我尝试使用这个 stackoverflow 问题中描述的内容：

Creating a dynamic html form

我的代码是这样的（注意我在表单中使用@manager 而不是@user，以免将rails 与current_user 混淆。仍然@manager 创建一个设计用户。

用户/新用户

<%= form_for(@manager) do |f| %>
<% if @manager.errors.any? %>
<div id="error_explanation">
<h2><%= pluralize(@manager.errors.count, "error") %> prohibited this manager from being saved:</h2>

  <ul>
  <% @manager.errors.full_messages.each do |msg| %>
    <li><%= msg %></li>
  <% end %>
  </ul>
  </div>
  <% end %>

  <div class="field">
<%= f.label :email %><br />
<%= f.text_field :email %>
</div>
<span class="add">Add fields</span>
<div class="actions">
<%= f.submit %>

app/assets/javascripts/application.js

//= require jquery
//= require jquery_ujs
//= require_tree .
$(document).ready(function() {
  $(".add").click(function() {
    $(".field:first").clone(true).insertBefore(this);
  return false;
  });
});

不过，当我单击“添加字段”时，没有任何反应。我很确定我是否可以让表单提交正确的参数，然后我可以让控制器做我想做的事情。

基本上，为什么克隆功能在上面的示例中不起作用，我怎样才能获得一个动态表单来一次创建多个设计用户。

另外，我省略了删除字段方法，因为它显然也不起作用。

编辑：我将选择器更改为“.add”，并将“.field”更改为“.field:first”，但它仍然无法正常工作。

Answer 1

“add”不是一个有效的选择器……你需要一个“.”前缀表示它是一个类。没有前缀，您正在寻找“添加”的 tagName

http://api.jquery.com/category/selectors/

 $(".add").click(function() {....

如果您多次点击，那么由于您的“.field”选择器，您将添加与表单中存在的一样多的 class="field" 元素。

你可能应该使用类似的东西：

   $(".field:first").clone(true).....