1. Install plugin
script/plugin install http://calendardateselect.googlecode.com/svn/tags/calendar_date_select
2. Include JS & CSS to your layout file
<link href="/stylesheets/calendar_date_select/blue.css" media="screen" rel="stylesheet" type="text/css" />
<script src="/javascripts/calendar_date_select/calendar_date_select.js" type="text/javascript"></script>
3. Calendar date select tag
<input type="text" name="user[date_of_birth]" size="30" autocomplete="off" onselect="new CalendarDateSelect( this, {year_range:50} );" onclick="new CalendarDateSelect( this, {year_range:50} );" value="<%= Date.today %>"/>
Restart the server as the plugin has been installed! Calendar date select works!
Notes :
1. If you wish to turn on the time, use this => new CalendarDateSelect( this, {year_range:50, time:true} );
2. Adding (autocomplete="off") turns off the auto complete