Skip to content Skip to sidebar Skip to footer
Home / Forms / Html / Ruby On Rails 3 / Wrapper

How To Wrap Every Select Of Date_select With A Div In Rails?

Post a Comment
I'm using Ruby on Rails 3 to create a form for the user, where he can save his birthdate. All the actions around the controller and model work just fine. But I'm having trouble wit

Solution 1:

Method 1 (Difficult)

Override the date_select code to handle this special instance for you: https://github.com/rails/rails/blob/master/actionview/lib/action_view/helpers/date_helper.rb#L283

Method 2 (Easy)

Use jQuery:

// Find all select boxes that have an ID attribute containing "birthday"// and wrap a div tag around them with a certain class
$('select[id*="birthday"]').wrapAll('<div class="select_wrapper">');

Solution 2:

I am using a solution involving the parameter :date_separator. Something along the lines of this:

.select-wrapper
  = f.date_select :birthday, :start_year => Time.now.year - 120, :end_year => Time.now.year, :date_separator => '</div><div class="select-wrapper">'

Solution 3:

This is not the prettiest, but it worked well for me ...

<divclass="small-4 columns"><%= f.date_select :release_date, {date_separator: "</div><divclass='small-4 columns'>"} %></div>

Where <div class="small-4 columns"></div> was what I wanted everything to be wrapped in. Basically just made sure that the date_separator was the closing of my tag and the opening of my next one, and made sure that the opening of my first tag was before the date_select and the closing of my last tag was after the date_select.

Solution 4:

In How to let custom FormBuilder wrap datetime_select's selects in e.g. a div? I basically face the same problem.

JavaScript is not an option for me and the date_separator hack is ... a hack :)

I came up with the following solution (works for me, in HAML). I think it is the cleanest solution so far but relies on some Rails internals.

- date_time_selector = ActionView::Helpers::DateTimeSelector.new(Time.current,
            { prefix: @usage.model_name.param_key,
              field_name: :starttime.to_s,
              include_position: true })
.select
  = date_time_selector.select_year
.select
  = date_time_selector.select_month
.select
  = date_time_selector.select_day
.select
  = date_time_selector.select_hour
.select
  = date_time_selector.select_minute

All you have to do is adjust the prefix (@usage in my case) and the field_name (Attribute-name, @usage.starttime / starttime in my case). In this example, I wrap the corresponding date fields in a div of class "select".

For reference, there are many more options to play with, here are links to the relevant code:

Solution 5:

I had a similar problem but I wanted each select box to have its own class.

Here's what I did (using ERB not HAML):

<%= select_month(@person.birthday, field_name: "birthday(2i)", prefix: "person", prompt: true) %>
<%= select_day(@person.birthday, field_name: "birthday(3i)", prefix: "person", prompt: true) %>
<%= select_year(@person.birthday, field_name: "birthday(1i)", prefix: "person", start_year: Date.today.year, end_year: 1905, prompt: true) %>

Then I was able to wrap each in a div with the proper class but you could also add classes directly to the select tags like this:

<%= select_month(@person.birthday, {field_name: "birthday(2i)", prefix: "person", prompt: true}, class: "class_name") %>

Post a Comment for "How To Wrap Every Select Of Date_select With A Div In Rails?"