bootstrap class not working with select

Question

I am working on ruby on rails application and trying to reduce size of select. I have 'bootstrap gem' installed for my application. Here is the code

 <%= f.select :fromyear, (1995..Time.now.year).to_a.reverse, 
     :include_blank => {:year => "Select year"}, :class=>"input-small" %>

as I noticed class values from this question Change width of select tag in Twitter Bootstrap. But seems like it is not working with this select. I have tried

<%= f.select :fromyear, (1995..Time.now.year).to_a.reverse, 
    :include_blank => {:year => "Select year"}, :style=>"100px" %>

but nothing happened. Plz let me know what i am missing. Thanks

I am using form_for on other page. It is working fine on that view — Saghir A. Khatri, Apr 21 '14 at 12:49

score 2 · Answer 1 · answered Apr 21 '14 at 14:27

As per the syntax for f.select (in form_for):

f.select(method, choices = nil, options = {}, html_options = {}, &block)

Right now you are passing include_blank and class as options parameter which is why the class is not applied. class must go inhtml_options.

All you need to do is separate out options and html_options.:

 <%= f.select :fromyear, (1995..Time.now.year).to_a.reverse, 
     {:include_blank => {:year => "Select year"}}, :class=>"input-small" %>
     ^                                          ^ 
   ## Added a curly bracket to separate out `include_blank` option and `class` option.

score 1 · Answer 2 · answered Apr 21 '14 at 13:38

1

Maybe you forget to input the 'width' in the option :style ?

:style=>"width:100px"

answered Apr 21 '14 at 13:38

D.Fux

376
2
12

Raghuveer · Answer 3 · 2014-04-21T13:48:20.983

1

Did you try this way?

= a.input :country, :as => :select, :collection => country_code_localized_map, :include_blank => false, :input_html=>{:class => "reg-input"}

Or else you can add another %DIV.select_above_class above the select tag and apply styles via above class to select tag

.select_above_class select{
   // your css styles
}

edited Apr 21 '14 at 13:48

answered Apr 21 '14 at 13:41

Raghuveer

2,630
3
29
59

score 0 · Accepted Answer · answered Apr 21 '14 at 14:54

Try this

<%= f.select(:fromyear, options_for_select((1995..Time.now.year).to_a.reverse), {:include_blank => 'Select year'}, { :class => 'input-small' }) %>

Or you can even include inline style inside a select tag with

<%= f.select(:fromyear, options_for_select((1995..Time.now.year).to_a.reverse), {:include_blank => 'Select year'}, { :class => 'input-small', :style => 'width:200px;', required: true }) %>

bootstrap class not working with select

4 Answers4