javascript - Rails - 在创建父级时，如何动态创建属于 has_many 关系一部分的成员？

Question

因此，在 Rails 应用程序中，我的数据库、硬盘驱动器中有一个表，对于每个硬盘驱动器，我都有可变数量的磁头和盘片。当我创建或编辑硬盘驱动器时，我想要 a) 动态显示所需的磁头状态和盘片状态表单的数量，或者 b) 将用户路由到页面上连续具有适当数量的磁头和状态表单的页面。我喜欢选项a，但我认为它需要一些自定义的javascript或其他东西才能使其工作(除非有插件，否则不太可行，我不知道javascript)。真的，我想拒绝任何未输入盘片和磁头状态的硬盘。

(变量名称当然是hard_drive、platter_status和head_status)

例如，如果我有一个笔记本电脑驱动器，我想在创建驱动器时定义它有 1 个磁头和盘片。当磁头和盘片计数组合框中的值发生变化时，显示盘片和磁头状态的表单。当点击创建按钮时，它应该使用数据在数据库中创建hard_drive，并根据需要创建每个platter_status和head_status项。

我该怎么做？我知道在 View 中，我必须添加一些内容来检测组合框中的更改并使用组合框中的值显示布局。

本质上与this类似。

<小时/>

编辑 1:所以，我有this ，到目前为止还不起作用，但我有正确的想法。我偶然发现了一些讨论使用 javascript 动态添加 html 的线程。

  <div class="field" id="head_count" >
    <label for="hard_drive_head_count">Head count</label><br />
    <input id="hard_drive_head_count" name="hard_drive[head_count]" type="number" value="0" />
    <script type="text/javascript">
      var input = document.getElementById('hard_drive_head_count'),
        events = [
        "input",
         ];
      events.map(function(ev) {
      input.addEventListener(ev, function() {
        console.log(ev + ' => ' + input.value);
    if (parseInt(input.value) === 1) {
      document.getElementById('platter_statuses').innerHTML= "howdy";
    } else {
      document.getElementById('platter_statuses').innerHTML="";
    }
      }, false);
      });
    </script>
  </div>
  <label for="platter_status">Platter status</label><br />
  <div class="field" id="platter_statuses" >

  </div>

现在我有了这个，问题转移到 - 如何使用 platter_status View 的 _form.html.erb 中的表单快速填充它，并从数据库中按应有的方式填充所有内容？我在 else 中考虑过使用一些动态 ruby​​，但我不知道如何传递参数(盘片号和驱动器 id)，以便数据库知道用什么填充它，而且我不知道在 <%= @SOMETHING_HERE %> 中的 @ 之后放置什么，以便它解析为 platter_status View ...

Answer 1

我实际上发现有一个非常适合我需要的助手。它是模型中的 Accepts_nested_attributes_for 函数。这与 Rails Cast 196 和 197 相结合帮助我实现了我想要的目标。

在硬盘驱动器型号中，您应该有:

attr_accessible :head_statuses_attributes
has_many :head_statuses, :dependent => :destroy
accepts_nested_attributes_for :head_statuses, :allow_destroy => true

针对 head_status 和 platter_status 模型。

在 View 中，您需要这样一行:

<%= link_to_add_fields "add head status", f, :head_status %>

并且在任何标记之外的部分，您需要:

 <%= link_to_remove_fields "Remove", f %> 

有关详细信息，请参阅以下文章: how accepts_nested_attributes_for works

How the dynamic editing is possible How the dynamic editing is possible part 2