Question

确定。奇怪的问题在这里。我在rails中构建嵌套表单，当我检查html和查看页面源时它看起来很好，但是对于collection_select选项没有显示下拉列表。再一次，我可以在html中看到我的所有选项，但在实际窗口中，下拉列表并不存在。它几乎就像我将它设置为显示的CSS：none;我没有。

这是嵌套的表单代码：

<%= form_for(@project) do |f| %>
  Countertops:

<%= f.fields_for :countertops, Countertop.new do |countertops_form| %>

<div class="form-group" align="left">
    <%= countertops_form.label :counterzip, "Tell us where your countertop project is going." %>
    <%= countertops_form.text_field :counterzip, class: "form-control", placeholder: "Enter your Zip Code" %>
</div>

<div id="countertype" class="form-group" align="left">
    <%= countertops_form.label :countertype_id, "What type of countertop material do you need?" %></br>
    <%= countertops_form.collection_select :countertype_id, Countertype.all, :id, :name, { :prompt => "Select Your Material" }, class: "input-sm"  %>
</div>

<% end %>

<div class="form-actions">
<%= f.button :submit %>
</div>
<% end %>

这里是collection_select的结果HTML。

<div id="countertype" class="form-group" align="left">
    <label for="project_countertops_attributes_0_countertype_id">What type of countertop material do you need?</label></br>
    <select class="input-sm" name="project[countertops_attributes][0][countertype_id]" id="project_countertops_attributes_0_countertype_id">
<option value="">Select Your Material</option>
<option value="1">Granite</option>
<option value="2">Marble</option>
<option value="3">Soapstone</option>
<option value="4">Wood</option>
<option value="5">Quartz</option>
<option value="6">Concrete</option></select>
  </div>

那么为什么我在加载时无法在页面上看到这个？我可以看到标签，我可以看到第一个字段的表单。

我错过了什么？

Answer 1

祝贺它正常运行 - fields_for可能很棘手，但我发现你在这里工作得很好。您的HTML看起来也是正确的。

如果您没有在屏幕上看到该元素，则有两种可能性：

<强> CSS

你提到CSS应该没问题。

永远不会低估CSS的细微差别。我看到你有以下内容：

<div id="countertype" class="form-group" align="left">
    <%= countertops_form.label :countertype_id, "What type of countertop material do you need?" %></br>
    <%= countertops_form.collection_select :countertype_id, Countertype.all, :id, :name, { :prompt => "Select Your Material" }, class: "input-sm"  %>
</div>

我高度建议在没有任何CSS的情况下尝试：

<div>
   <%= countertops_form.collection_select :countertype_id, Countertype.all, :id, :name, { :prompt => "Select Your Material" }  %>
</div>

-

<强> fields_for

您遇到的另一个问题是fields_for - 您正在将Countertop.new传递给该方法。虽然这应该没有问题，但在做这样的事情之前我还有问题。

如果您绝对想要传递新的fields_for对象，则应在控制器中构建它：

#app/controllers/projects_controller.rb
class ProjectsController < ApplicationController
   def new
      @project = Project.new
      @project.countertops.build
   end
end

这将允许您使用以下HTML：

<%= f.fields_for :countertops do |countertops_form| %>

Rails嵌套的collection_select出现在HTML中但不在屏幕上

1 个答案: