0

How can I style the visual drop-down of a collection select in Rails? I want to change the background color of individual items in the drop-down, with the color derived from an attribute in the Affiliation object. Here is the current collection_select:

<%= collection_select(:application, :affiliation_id, Affiliation.all.order(:priority).all, :id, :name, :include_blank => true)  %>

The Affiliation objects have an attribute called "priority" and I want to assign a color to be displayed based on each Affiliation's priority.

Erica
  • 213
  • 2
  • 16
Chris Lyons
  • 1
  • See [this](http://stackoverflow.com/questions/34247055/rails-how-to-add-custom-data-attributes-in-collection-select) or [this](http://stackoverflow.com/questions/5052889/ruby-on-rails-f-select-options-with-custom-attributes) – byakugie Nov 02 '16 at 00:39

2 Answers2

0

add 

class: 'color_<%= affiliation.color %>'

in collection_select and create same style classe

.color_1 { background-color:#colorvalue; }  # for affiliation.color == 1

in css file

rfellons
  • 656
  • 12
  • 28
0

In you .css file add extra class for collection_select

.collection_select_background { background: #color_name; }

And you can use class called .collection_select_background i.e

<%= collection_select(:application, :affiliation_id, Affiliation.all.order(:priority).all, :id, :name, :include_blank => true), **class: collection_select_background** %>

I hope this will work for you.

Erica
  • 213
  • 2
  • 16
  • More for reference http://apidock.com/rails/ActionView/Helpers/FormBuilder/collection_select – Erica Nov 02 '16 at 03:16