Simple and clean JS calendar to enter dates on forms... as if we had <input type="calendar" />, hence the name.
CoffeeScript Ruby
Switch branches/tags
Permalink
Failed to load latest commit information.
lib if date field is blank calendar should populate it with the current d… Sep 27, 2012
src
vendor if date field is blank calendar should populate it with the current d… Sep 27, 2012
.gitignore first commit Jun 7, 2011
Gemfile first commit Jun 7, 2011
LICENSE first commit Jun 7, 2011
README.md
Rakefile use underscore map instead of native map Jun 7, 2011
example.html if date field is blank calendar should populate it with the current d… Sep 27, 2012
example.png update example to not include part of a growl notification Jun 7, 2011
input_calendar.gemspec first commit Jun 7, 2011

README.md

input_calendar

At the current time input_calendar is optimized for calendars that stay in place and are used in place (how I usually prefer a calendar in apps). No reason it couldn't be enhanced to hide/show dynamically and support visible date fields.

Interesting in patches to make it more configurable as long as it stays simple and elegant.

Here is what it looks like with the default CSS:

sample of input_calendar_

How to use

In your view:

<% form_for @event do |f| %>
  <%= f.hidden_field :date, :class => "calendar" %>
  <%= javascript_tag "Calendar.attach('event_date', {class: 'mycustomcssclass'})" %>
<% end %>

Or avoid the inline JS with some jQuery (coffeescript) somewhere:

$(document).ready -> 
  $("input.calendar").each (i, o) -> 
    Calendar.attach(o)

Options you can pass attach

  • class - custom CSS class (or multiple classes)
  • onchange - function that is called each time a date is selected
  • footer - underscore.js style template string for the footer
    • Supports: month (full name), day, year, day_of_week (full name)

Example of using footer:

Calendar.attach("event_date", {footer: "<strong>Due by:</strong> <%= month %> <%= day %>, <%= year %>"})

Installing

Requirements

Requires jQuery and underscore.js.

Rails 3.1

You'll need to add input_calendar to your Gemfile and then the asset pipeline will see that the appropriate JS and CSS files are included in your app.

Add to your Gemfile:

gem "input_calendar"

And install:

bundle install

Rails 3.0 (using Bundler)

A rake task is included to copy the JS and CSS files into your public folder.

Add to your Gemfile:

gem "input_calendar"

Then copy the files locally:

bundle install
bundle exec rake input_calendar:copy_files

Should give you:

create  public/javascripts/input_calendar.js
create  public/stylesheets/input_calendar.css

Rails 2.x

TODO: Add directions here.