我正在尝试在我的rails应用中使用bootstrap multiselect。
在我正在使用它的视图中,我使用
初始化插件<script type="text/javascript">
$(document).ready(function() {
$('.multiselect').multiselect();
});
</script>
它似乎可以使用demo html:
<select class="multiselect" multiple="multiple">
<option value="cheese">Cheese</option>
<option value="tomatoes">Tomatoes</option>
<option value="mozarella">Mozzarella</option>
<option value="mushrooms">Mushrooms</option>
<option value="pepperoni">Pepperoni</option>
<option value="onions">Onions</option>
</select>
这很棒,但我无法使用我的rails选择代码。这是我的尝试:
<%= f.fields_for :sizes do |size_fields| %>
<%= size_fields.label :scale_id, simple_pluralize(@miniset.scales.count, 'Scale') %>
<%= hidden_field "Set Scale", @miniset.sizes %>
<div class = "form-inline"><%= size_fields.select :scale_id, options_from_collection_for_select(Scale.all, :id, :name, @miniset.scales.map(&:id)), {include_blank: '', :class => 'multiselect', :multiple => true} %>
<% end %></div>
我认为问题是:class => 'multiselect', :multiple => true
没有像<select class="multiselect" multiple="multiple">
那样调用JQuery,但我想必须有办法让这个工作。任何帮助都非常感激。
编辑:我应该补充一点,我的选择IS会显示出来,它只是没有像here那样显示为预期的智能多重选择。
编辑2:浏览器显示的选择代码为:
<label for="miniset_sizes_attributes_0_scale_id">Scales</label>
<input id="Set_Scale_#<ActiveRecord::Associations::CollectionProxy::ActiveRecord_Associations_CollectionProxy_Size:0x007fcf644c0c08>" name="Set Scale[#<ActiveRecord::Associations::CollectionProxy::ActiveRecord_Associations_CollectionProxy_Size:0x007fcf644c0c08>]" type="hidden" />
<div class = "form-inline"><select id="miniset_sizes_attributes_0_scale_id" name="miniset[sizes_attributes][0][scale_id]"><option value=""></option>
<option value="1">28mm</option>
<option value="2">54mm</option>
<option value="3">6mm</option>
<option value="4">15mm</option>
<option value="5">1/76</option></select>
</div>
没有多选或多重的迹象。 HMM。
答案 0 :(得分:3)
您的选择字段选项由此生成:
options_from_collection_for_select(Scale.all, :id, :name, {:selected => @miniset.scales.map(&:id)})
选择的值(在您的情况下为id)不应该作为哈希传递,而是作为数组传递:
options_from_collection_for_select(Scale.all, :id, :name, @miniset.scales.map(&:id))
此外,您将class
和multiple
属性作为选择选项的一部分传递 - 但这些是不受支持的选项,并且缺少的类导致jquery选择器无法找到您的选择字段。你想要的是将它们作为标准的 HTML选项传递,这需要第二个哈希。这是您应该使用的完整select
构建器:
size_fields.select :scale_id,
options_from_collection_for_select(Scale.all, :id, :name, @miniset.scales.map(&:id)),
{include_blank: ''},
{class: 'multiselect', multiple: true}