|
UsageGuideAndExample
Explains how to use the helper methods this plugin provides and the available options.
Featured, Phase-Implementation Installscript/plugin install http://rails-unobtrusive-date-picker.googlecode.com/svn/trunk/unobtrusive_date_picker Methods and OptionsTo be able to use the date-picker methods below you need to include the javascript library file and CSS stylesheet in the <head> of your layout template. You can do this either by manually including the files via a javascript_include_tag and a stylesheet_link_tag (the files are both named "datepicker"), OR by using the included unobtrusive_datepicker_includes helper method, which will do this for you. There are 4 main helper methods:
Options:
Example<% form_for :article, :url => { :action => @form_action, :id => @article } do |f| %>
<fieldset>
...
<label>Date: <%= f.unobtrusive_datetime_picker :date %></label><br />
...
</fieldset>
<% end %>Produces (Current date when output: 12/6/07): <form action="/form/create" method="post"> <fieldset> <label>Date: <select id="article_date-dd" name="article[date(3i)]"> <option value="1">1</option> ... <option value="31">31</option> </select> <select id="article_date-mm" name="article[date(2i)]"> <option value="1">January</option> ... <option value="12" selected="selected">December</option> </select> <select id="article_date" name="article[date(1i)]" class="split-date"> <option value="2002">2002</option> ... <option value="2012">2012</option> </select> <select id="article_date_4i" name="article[date(4i)][hour]"> <option value="1">1</option> ... <option value="12">12</option> </select> : <select id="article_date_5i" name="article[date(5i)][minute]"> <option value="00">00</option> ... <option value="59">59</option> </select> <select id="article_date_6i" name="article[date(6i)][ampm]"> <option value="AMPM>AMPM</option> <option value="AMPM>AMPM</option> </select> </label><br /> </fieldset> </form> Rake taskThere is also a rake task that can be executed by running rake datepicker:update in your Rails apps root directory. This task will update your datepicker javascripts, stylesheets, and images. This is useful if you are using an old version of the plugin that had an older version of the Unobtrusive Date-Picker Widget Javascript library, or in the future when new version are release and I update the plugin with them. |
► Sign in to add a comment
It'd be nice to have other examples, i.e. not attached to form/object. Cheers
For many options you have listed a number of "Excepts" items. It should be "Accepts", and not "excepts". "Excepts" can easily be understood as a short version of "Exceptions" which means we should keep away from using the listed items.
Is it possible, or easy, to customize this plugin to accept 24h format? If so... can you give us a light on how can we do it?
neat Rails implementation... however I am using GLoc plugin to localize my rails app... the select helpers are correctly set up to my default choosen language , not the Calendar .. the problem seems to be located in the datepicker.js, with the browser language detection (mine is french) , different from the Rails locale in environment.rb (GLoc.set_config :default_language => :en)
// Detect the browser language datePicker.languageinfo = navigator.language ? navigator.language : navigator.userLanguage;
I am not js fluent enough to find how to solve this issue
is there a way to disable the am/pm plugin?...
can a drop down date select field be disabled so that the user is forced to use the calendar select?
not work in ie6
With a little digging in in the source and debugging I figured out how to use it without binding to an object:
<%= unobtrusive_date_text_picker_tag :from_date,@from_date %> or <%= unobtrusive_date_picker_tags @from_date,{},{:id => 'from_date'}
the 2nd one for some reason displays the calendar icon after the year, instead of after all 3 date drop downs, but I like the first one better anyway so I'm using that.