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

时间:2013-12-19 18:57:14

标签: javascript ruby-on-rails ruby nested-forms nested-attributes

我有一个有两个模型的rails应用程序:Schedule和Task。任务belongs_to计划和计划has_many任务。我使用带有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>

以下是表单的计划控制器操作:

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

因此,正如您从控制器中看到的那样,表单将自动将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. 有没有办法改变这个以获得更简洁的数字而不会破坏功能?
  3. 如果有人见过使用#197的rails,那么此表单就是基于此。这是我的javascript和我也在使用的红宝石助手。

    的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
    

2 个答案:

答案 0 :(得分:0)

在没有看到更多代码的情况下,很难确定,但我认为这些是您在导轨端task.build时创建的“临时”ID。使用debuggerpry或某些puts @schedule.tasks.all.collect{|t| t.id}进行检查。

如果是这种情况,那么不,你不能“得到更整洁的数字”,但你不会想要 - 你只需要那些是唯一的,并让Rails很好地处理创建任务。因此,只需检查一下create操作后您的数据库是否符合预期,并将其调用完毕。

答案 1 :(得分:0)

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处理这个庞大的数字:首先,它会阻止你app的潜在邪恶用户,其次,它几乎是 - 肯定是一个独特的人。


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

  

如果没有损坏,请不要修复它。