javascript - 设置动态嵌套表单名称和 ID 属性

Question

我有一个包含两个模型的 Rails 应用程序:Schedule 和 Task。 Task belongs_to Schedule 和 Schedule has_many Tasks。我使用带有 javascript 的嵌套表单来允许用户在创建计划时输入任意数量的任务。这是我的表格:

<%= form_for [@project, @schedule] do |f| %>
    <%= f.fields_for :tasks do |builder| %>
        <%= render 'task_fields', :f => builder %>
    <% end %>
    <p><%= link_to_add_fields "Add task", f, :tasks %>
    <p><%= f.submit "Submit" %></p>
<% end %>

这里是上面表格所指的部分:

<p class = "fieldo">

     <%= f.label :title %><br />
     <%= f.text_field :title %><br />

     <%= f.label :content %><br />
     <%= f.text_field :content %><br />

     <%= f.hidden_field :_destroy %>

    <%= link_to_function "remove", "remove_fields(this)"  %>
</p>

这是表单的调度 Controller 操作:

def new
    2.times {@schedule.tasks.build}
end

因此，正如您从 Controller 中看到的那样，表单会自动将 2 个任务表单打印到页面。这 3 种形式给出了以下 html:

<p class = "fieldo">
    <input id="schedule_tasks_attributes_0_title" name="schedule[tasks_attributes][0][title]" type="text" /><br />
    <input id="schedule_tasks_attributes_0_content" name="schedule[tasks_attributes][0][content]" type="text" /><br />
</p>
<p class = "fieldo">
    <input id="schedule_tasks_attributes_1_title" name="schedule[tasks_attributes][1][title]" type="text" /><br />
     <input id="schedule_tasks_attributes_1_content" name="schedule[tasks_attributes][1][content]" type="text" /><br />
</p>

如您所见，id 和 name 从 0 开始并递增 1。这很好，也是我期望的工作方式。问题是，当我通过按“添加任务”按钮动态添加任务时，id 和名称变成这样的随机数:

<p class = "fieldo">
    <input id="schedule_tasks_attributes_1387479041550_title" name="schedule[tasks_attributes][1387479041550][title]" type="text">
    <input id="schedule_tasks_attributes_1387479041550_content" name="schedule[tasks_attributes][1387479041550][content]" type="text">
</p>
<p class = "fieldo">
    <input id="schedule_tasks_attributes_1387479043642_title" name="schedule[tasks_attributes][1387479043642][title]" type="text">
    <input id="schedule_tasks_attributes_1387479043642_content" name="schedule[tasks_attributes][1387479043642][content]" type="text">
</p>

我的问题是:

1. 这些数字是什么？它们是如何生成的？
2. 有什么方法可以改变这一点，在不破坏功能的情况下获得更整洁的数字吗？

如果有人看过 rails cast #197，这个表格就是基于那个。这是我的 javascript 和我也在使用的 ruby 助手。

JavaScript:

//Dynamic forms
 function remove_fields(link) {
         $(link).prev("input[type=hidden]").val("1");
         $(link).closest(".fieldo").hide();
 }

 function add_fields(link, association, content) {
         var new_id = new Date().getTime();
         var regexp = new RegExp("new_" + association, "g");
         $(link).parent().before(content.replace(regexp, new_id)); 

 }

应用助手:

def link_to_add_fields(name, f, association)
  new_object = f.object.class.reflect_on_association(association).klass.new
  fields = f.fields_for(association, new_object, :child_index => "new_#{association}") do |builder|
        render(association.to_s.singularize + "_fields", :f => builder)
  end
  link_to_function(name, raw("add_fields(this, \"#{association}\", \"#{escape_javascript(fields)}\")"))
end

Answer 1

1): 这个巨大的数字来自 Javascript 行 var new_id = new Date().getTime(); 它使用时间戳设置新行的 HTML id，这使得它“差不多”uniq。

---

2): 是的，您可以将其更改为使用“合理的人类数量”。

function add_fields(link, association, content) {
         var new_id = Math.floor((Math.random()*10000)+3);
         var regexp = new RegExp("new_" + association, "g");
         $(link).parent().before(content.replace(regexp, new_id)); 
}

这将用 10003 到 3 之间的随机数替换这个巨大的数字。但是我建议你让 Rails 处理这个巨大的数字:首先，它阻止你应用程序的潜在恶意用户，其次，它几乎 -确保一个 uniq id。

---

但是，嘿，永远记住 #1 开发者的规则:

If it ain't broken, don't fix it.