How to create a grouped select box using simple_form?

Question

I'm using simple_form gem for creating Rails forms. http://github.com/plataformatec/simple_form

All is great, except how do I create a grouped select box? Can't find it in the docs or by google-ing.

Answer 1

The question is old but it's the top result for "simple_form grouped select" google search anyway so I figured the next reader might benefit from a few creative ways to create these with the latest simple_form (taken from tests, which are always the best documentation indeed)

<%= f.input :author,
 :as => :grouped_select,
 :collection => [['Authors', ['Jose', 'Carlos']], ['General', ['Bob', 'John']]],
 :group_method => :last %>

<%= f.input :author,
 :as => :grouped_select,
 :collection => Proc.new { [['Authors', ['Jose', 'Carlos']], ['General', ['Bob', 'John']]] },
 :group_method => :last %>

<%= f.input :author,
 :as => :grouped_select,
 :collection => { ['Jose', 'Carlos'] => 'Authors' },
 :group_method => :first,
 :group_label_method => :last %>

<%= f.input :author,
 :as => :grouped_select,
 :collection => { 'Authors' => ['Jose', 'Carlos'] },
 :group_method => :last,
 :label_method => :upcase,
 :value_method => :downcase %>

Answer 2

If you hava two models which are category, subcategory as follows:

class Category < ActiveRecord::Base
    has_many :products
    has_many :subcategories
end

class Subcategory < ActiveRecord::Base
    belongs_to :category
    has_many :products
end

Then you can use

<%= simple_form_for [:admin, @yourmodel] do |f| %>
    <%= f.input :subcategory_id, collection: Category.all, as: :grouped_select, group_method: :subcategories, prompt: "Select One" %>
    <%= f.submit "Submit" %>
<% end %>

which result like this:

<div class="form-group grouped_select optional yourmodel_subcategory_id">
    <label class="grouped_select optional control-label" for="yourmodel_subcategory_id">Subcategory</label>
    <select class="grouped_select optional form-control" id="yourmodel_subcategory_id" name="yourmodel[subcategory_id]">
    <option value="">Select One</option>
    <optgroup label="Your 1st Category">
        <option value="This subcategory id">one subcategory belongs to Your 1st Category</option>
    </optgroup>
    <optgroup label="Your 2nd Category">
        <option value="This subcategory id">one subcategory belongs to Your 2nd Category</option>
    </optgroup>
    </select>
</div>

Hope this helps.

Answer 3

Only sane way I've found to create grouped select boxes is to use the select helper passing in a grouped_options_for_select which does take a selected_key parameter for the choices argument (so you can ensure the one thats set in your model actually gets selected). You'll see the full call below. Sorry if its confusing.

-# @answer is the model instance passed into simple_form_for/form_for
select(@answer.class.to_s.underscore, :question_id, option_groups_from_collection_for_select(@categories, 'questions.order(:display_order)', :name, :id, :question, @answer.question_id))

If there's a better way to do this that selects the proper value, I'm all ears as well.

tl;dr: nope not seeing any way with either form_for or simple_form_for to create grouped selects, the above should help at least.

Answer 4

I just had a look into the tests as well. If you want to pass a different value to the option tag, use the following to pass it to the collection:

Agent = Struct.new(:id, :name)
agents = [["First", []], ["Second", [Agent.new(7, 'Bond'), Agent.new(47, 'Hitman')]]]

see https://github.com/plataformatec/simple_form/blob/master/test/inputs/grouped_collection_select_input_test.rb