ruby-on-rails - 如何将 AJAX 与多个嵌套表单一起使用？ "The Gym Plan"问题

Question

我希望能够通过 AJAX 将一些数据填充到表格中。我的问题是这些数据来自两个不同的模型。这会很长，但请耐心等待。

设想一个应用程序可以满足在健身房锻炼的计划(显然不是我的应用程序 :D)。该计划有许多例程(按类型或按天计算)，其中有许多步骤要经过。

是否可以使用 AJAX 来填充动态填充的漂亮表格？理想情况下，我更愿意在用户每次填写任何新数据时保存并显示一个表格。

我目前拥有的:

在模型中，我添加了 accepts_nested_attributes_for 属性。

我正在使用 nested_form这允许我们添加和删除嵌套模型。

让我们看看我们的表单:

• app/views/plans/_form.html.erb

  <%= nested_form_for @plan, :url => plan_path(@plan), :html => { :class => :form } do |f| %>
    <%= f.label :name, "Plan Name" %>
    <%= f.text_field :name %>
    <%= f.fields_for :routines do |r| %>
      <%= render 'routine_fields', :f => r %>
    <% end %>
    <%= f.submit %>
    <%= f.link_to_add "Add a routine", :routines %>
  <% end %>
  

所以 fields_for 允许我们在计划中保存许多例程，NICE!让我们定义我们的字段 View :

• app/views/plans/_routine_fields.html.erb

  <%= f.label :name, "Routine Name" %>
  <%= f.text_field :name %>
  <%= f.fields_for :steps do |s| %>
    <%= render 'step_fields', :f => s %>
  <% end %>
  <%= f.link_to_add "Add a step", :steps %>
  <%= f.link_to_remove "Remove this routine" %>
  

• app/views/plans/_step_fields.html.erb

  <%= f.label :name, "Step Name" %>
  <%= f.text_field :name %>
  <%= f.link_to_remove "Remove this step" %>
  

这很好用!我们可以在一个计划中添加尽可能多的例程，在一个例程中添加尽可能多的步骤，我们能够在一个 View 中创建一个完整的计划。

但是很丑!也很困惑!所以我的问题又来了:每次用户填写任何新数据时，我如何更新表格？

理想:

Answer 1

您可以为此使用的一种方法是将表单分解为不同的表单，这些表单通过 ajax 加载，并且只持续更新模型上的属性。您也可以只使用您现在拥有的表单并分解 html，这样它就不会全部显示在表格中。

要处理表单，您可以查看 railscast on wicked

对于ajax的处理，有一个很好的railscast on ajax/jquery

您还可以将此逻辑分解为不同的部分，并稍微更改 UX，以便用户仍然拥有相同的功能，但它存在于不同的 View 中。您可以按照前面提到的 ajax railscast 或使用 turbolinks gem 添加 ajax。 (尽管 turbolinks 有点不同)。

在我看来，这主要是一个用户体验问题，而您正试图将特定的实现 pry 入严格的用户体验中。我会尝试重构用户体验，看看是否有更优雅的解决方案来解决您提到的问题。