15

我在这里想念什么？我正在使用 Rails 4.0.0 并尝试新的 Bootstrap 3.0.0rc1。我有一个简单的“食谱盒”应用程序，它有一个食谱模型和一个类别模型，该模型为食谱上的“类别”字段提供信息。在 recipes#new 视图中，我定义了以下字段：

<h1>Create New Recipe</h1>
<%= form_for @recipe, html: { class: 'form-horizontal' } do |f| %>
<fieldset>
  <legend>Main Information</legend>
  <div class="form-group">
    <%= f.label :name, "Recipe name", class: "col-lg-2 control-label" %>
    <div class="col-lg-6">
      <%= f.text_field :name, class: "form-control" %>
    </div>
  </div>
<div class="form-group">
  <%= f.label :category_id, class: "col-lg-2 control-label" %>
  <div class="col-lg-6">
    <%= f.collection_select :category, Category.all, :id, :name, class: "form-control", prompt: "Select a category" %>
  </div>
</div>
...

text_field 帮助器呈现格式正确的标签，并带有类属性。但是，无论我如何构造 select 或 collection_select 帮助器，我似乎都无法让 Rails 给我一个包含类属性的方法。上面的代码给了我这个：

<select id="recipe_category" name="recipe[category]"><option value="">Select a category</option>

...

所以提示通过了，但类属性没有，所以看起来 html_options 哈希的一部分被识别了。但是没有应用 Bootstrap 样式。我是否在类周围使用大括号 {} 都没关系：“form-control”。我是否在 collection_select 参数周围使用括号都没关系。选择助手也会发生。

任何人都可以建议吗？你也在看这个吗？

4

4 回答 4

48

尝试使用：

<%= f.collection_select :category, Category.all, :id, :name, {prompt: "Select a category"}, {class: "form-control"} %>

根据rails 文档，首先是选项，然后是 html 选项。请记住，html 选项需要用大括号:{prompt: "Select a category"}或{class: "form-control"}.

于 2013-08-10T16:14:55.413 回答
10 
<%= f.collection_select :category, Category.all, :id, :name, {prompt: "Select a category"}, {class: "form-control"} %>

检查的答案不起作用，但因为正确答案隐藏在评论中（由 Alter Lagos 提供）而被检查。我试图通过将实际答案移出评论来避免混淆。

于 2013-12-12T18:32:28.237 回答
0

试试这个，对我有用！

<%= collection_select(:category, :category_id, @category_for_advertising, :id, :description, {}, {:class=>"dropdown-menu"}) %>
于 2017-05-13T02:15:48.120 回答
0

已回答的另一个版本，包含 W3CSS：

  <%= family_form.collection_select :billing_status_id,  
    > BillingStatus.by_tenant(@cutid).order(:description), :id,
    > :description, {}, {class: 'w3-select'} %>
 <%= family_form.label
    > :billing_status, class: 'w3-label' %>
于 2017-05-23T23:19:29.823 回答