9

I am developing Rails 3.1 application, I get confused about where should I put my own javascript code(e.g. my.js) and where to put 3rd-party javascript library (e.g. jQuery-UI).

I know in the old version Rails, javascript should all goes into public/javascripts/ directory, when I generate Rails 3.1 app, there is no public/javascripts/ folder, but there is app/assets/ and verndor/assets/ and there is application.js in app/assets, I would like to ask:

  1. in Rails 3.1 ,where should I put my.js and jQuery-UI js in Rails 3.1??
  2. what is the app/assets/application.js supposed to do?
  3. how can I include my.js and jQuery-UI js in my html page?

----------------Am I right?----------

Is require_tree in application.js is used to include 3rd-party libraries under app/vendor/assets/javascript/

and require "something" in application.js is used to include js file under app/assets/javascripts/?? Am I right?

Improve this question
0

2 Answers 2

Reset to default
7

Put your own javascript & coffeescript under app/assets/javascripts.

Take a look inside app/assets/javascripts/application.js. When you ran rails new APP it should have added //= require_tree . to this file. See section 2.3 for more.

This is a special instruction that Sprockets understands that wil automatically include all files in the same directory as your application.js file and in subfolders below it.

If you want jquery and jquery-ui to be loaded your application.js file should look like

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

If you have gem 'jquery-rails' in your bundle, this gem has already added the jquery files to the asset pipeline for you, so you don't have to worry about downloading them manually.

In your head section of your application view you will want to include javascript_include_tag "application" in the head section. Chances are, if you used the generator, it's already there.

Please read up on the Rails Asset Pipeline for more information.

The . in the line with require_tree is referencing the location of the current file. The //= operator is referencing the asset pipeline.

Placing a file in app/assets, lib/assets or vendor/assets will add it to the asset pipeline. See section 2.1.

Improve this answer
Sign up to request clarification or add additional context in comments.

4 Comments

@ Alex, you still get me confused, I am asking about the place where to put 3rd party library and where to put my own js file. And I am also confused about the usage and meaning of application.js . Is require_tree in application.js is used to include 3rd-party libraries under app/vendor/assets/javascript and require "something" in application.js is used to include js file under app/assets/javascripts?? Am I right?
In order to include a file that's in your asset pipeline, you should reference it in the correct order in your application.js. Your own javascript is excepted if you put it in app/assets/javascripts and use require_tree . in your application.js which is stored in this location.
the jQuery files are coming from gem 'jquery-rails'
Note that if you use the jquery-ui gem AND add the jquery-ui script manually, it'll cause problems. It's best to stick with the gem by itself.
5

Ryan Bates has a good overview of the asset pipeline on Railscasts. It helped me out when I was trying to sort it out. http://railscasts.com/episodes/279-understanding-the-asset-pipeline

Improve this answer

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.