Rails3.2.2でjQueryUIを使う #Ruby

jquery-ui-railsなるgemがあったのでそれを使う。
twitter-bootstrap-railsが適用済みの状態。

インストール

Gemfile

group :assets do
  gem 'jquery-ui-rails'
end

bundle install

app/assets/javascripts/application.js

//= require jquery.ui.all

app/assets/stylesheets/application.css

*= require jquery.ui.all

とりあえず全てのウィジェットを使えるようにする。
使用するウィジェットのみ読み込むことも可能。

datepickerを使ってみる。
アプリケーション全体で使用したいのでbootstrap.js.coffeeにdatepickerを追記。

app/assets/javascripts/bootstrap.js.coffee

jQuery ->
  $("a[rel=popover]").popover()
  $(".tooltip").tooltip()
  $("a[rel=tooltip]").tooltip()
  $('#datepicker').datepicker()

viewを修正。

app/views/products/_form.html.erb

<%= f.text_field :name, :class => 'text_field', id: 'datepicker' %>

これで完了。以下のように表示される。