Rails 3.1 JQuery-UI

If you are considering the upgrade to Rails 3.1.x and you wish to include the JQuery-UI in your web application follow these simple steps:

Load jquery-ui in your app/assets/javascripts/application.js

//= require jquery
//= require jquery_ujs
//= require jquery-ui
//= require_tree .

Pick and download a nice theme from: JQuery-UI themes site

Copy jquery-ui-1.8.16.custom.css(version number could differ) to your vendor/assets/stylesheets folder as jquery-ui.css (This will save you time later when you are updating or changing the theme) and include it in your app/assets/stylesheets/application.css

*= require_self
*= require jquery-ui
*= require_tree .

Copy images from the images folder to vendor/assets/images

Modify vendor/assets/stylesheets/jquery-ui.css and replace “images/” to “/assets/”

Now that you have everything set up and ready, go ahead and use the fancy JQuery-UI plugins

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.