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

时间:2012-03-14 18:44:31

标签: jquery ruby-on-rails forms devise

我在rails 3.2应用程序中使用了设计。

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

所有这一切都很好。

我想要做的是创建一个动态表单,以便管理员可以根据需要创建尽可能多的用户。应该有一个“添加用户字段”按钮和一个“删除用户字段”按钮,允许为用户生成新字段。

我似乎无法让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 %>

应用程序/资产/ Javascript角/ 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”,但它仍然无效。

1 个答案:

答案 0 :(得分:0)

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

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

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

如果您多次点击,那么由于您的“.field”选择器,您将在表格中添加尽可能多的带有class =“field”的元素。

你应该使用类似的东西:

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