In some cases, the Ruby on Rails time_select helper is much uglier than it needs to be. It spits out 3 select boxes for the hour, minutes, and seconds. Your users do not always need accuracy to the minute. For example, you do not schedule doctor’s appointments for 3:13PM. You would at least round to the nearest 15 minutes. Another shortcoming of the rails time_select helper is that you cannot configure it for 12 hour AM/PM times by default. You must write your own plugin to make this happen.

Yesterday I decided that I wanted a really simple time_select component for my Ruby on Rails application. Specifically, a time_select with only ONE select field. I developed the Simple Time Select plugin to do this, as well as handle minute intervals. For example, if you set your minute interval to 15, you get options such as: “6:00 PM”, “6:15 PM”, “6:30 PM”, etc. As you can see from the screen shot (where the interval is set to 20 minutes), this control also implements an AM/PM time format.
Also note that this component is great if you ONLY care about the time input from a user. As is, the helper does not generate the hidden date fields associated with the usual time_select helper.
Visit the github page to read more and install the plugin:
http://github.com/tamoyal/simple_time_select/tree/master
Also be sure to check out the latest update.
If you enjoyed this post, make sure you subscribe to my RSS feed!











10 Comments
Thank you – amazing, what I’ve been looking for for hours
Glad you like! Let me know if you find any issues. It’s been working great for me so far.
Nice plugin, works really well. I do think you would get more people to use it if you would fill in the normal i fields like 4i and 5i instead of putting it all into 5i and making us add code to the controller. No big deal for me, but I think it will put off a lot of people.
I modified the plugin so I could have a minute stop as well. I have configurable bus. hours in my application which includes minutes and I want the time_select to be between them.
I added this code, you can imagine where it goes:
start_minute += @options[:start_minute] if @options[:start_minute]
as for end_hour / minute I changed it to this:
end_minute = ( @options[:end_hour] ) * 60 – 1
end_minute += @options[:end_minute] if @options[:end_minute]
You were adding 1 to the hour, which in my test cases allowed the times to go an hour or 45 minutes past the end of the hour. This may be what you wanted, like if you said end at 7 pm, it would go to 7:45 if 15 minute_step. But for me I wanted that to be the actual stopping point.
@Jeff Thank you for the constructive criticism. I will add the minute stop option on the next release and try to fill in the 4i and 5i fields correctly. I think at the time I struggled to find documentation so the solution was a bit hackish. I did mean to add the hour at the end but I understand that can be confusing (which is why I added an example in the documentation about it). Maybe I will change that on the next rev as well. It does seem odd.
Hi Tony,
Really like the plugin, and seems to work nicely. However could you show me some controller sample code? Because for some reason I can’t save the data properly to the database.
Here’s what I have in my view:
Time.now.change(:hour => 9), :simple_time_select => true, :time_separator => "Van:", :start_hour => 7, :end_hour => 21 } %>
Time.now.change(:hour => 12), :simple_time_select => true, :time_separator => "Van:", :start_hour => 7, :end_hour => 21 } %>
And my controller:
@event = Event.new(params[:event])
params[:event][:start_at] = Time.parse(params[:event][:"start_at(5i)"])
params[:event][:end_at] = Time.parse(params[:event][:"end_at(5i)"])
But still I see: 00:00:00 in my database. (in my migration file, field is set to: t.time :start_at, end_at )
Any idea what i’m missing? Thanks.
I have something like this
As you can see I am parsing three simple time selects, but this should do it for you. Please let me know how it works so I can update the example accordingly. Thank you!
Hi Tony,
Thanks for your reply. Please forgive me, but I’m not pretty advanced at this stuff yet, I started programming just a couple of months ago so I’m struggling a bit and still very much in learning phase.
Anyway, let’s assume I have a params[:event] hash, containing: ’start_event’ and ‘end_event’ (2 time selects).
What should I do next?
My controller action is pretty standard:
def create
@event = Event.new(params[:event])
respond_to do |format|
if @event.save
... etc.. etc...
At first I had this, but unfortunely it didn’t work, and looking at your code sample that you’ve provided (in your last comment) took me a bit off-guard because I have no idea where to put it.
def create
@event = Event.new(params[:event])
params[:event][:start_at] = Time.parse(params[:event][:"start_at(5i)"])
params[:event][:end_at] = Time.parse(params[:event][:"end_at(5i)"])
respond_to do |format|
if @event.save
… etc.. etc…
Hope to hear from you soon. Thanks for the effort!
Hey Mitchell,
You’re not assigning the times to the event object. You want something more like:
Also you mentioned “start_event” and “end_event” while your code uses “start_at” and “end_at” …maybe that’s just a typo. Let me know how this works
Hi Tony,
Thanks that worked out perfectly fine for me, I’ve been playing around with it a bit more and I really like the plugin.
Thanks for your help!
Just found this the other day, hate the normal one and never did anything about it. Nice.