Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Adding JQuery or Javascript (not coffee.script) code to a Rails 3.2 app?

I just finished Code School's intro course on JQuery, jQuery Air: First Flight. It was a great way to learn the basics of jQuery and when I was done I was all excited about adding some jQuery to my new little rails 3.2 app. How to make that happen isn't obvious, though.

By default, rails 3.2 comes with the jquery-rails and coffee-rails gems. New 3.2 apps are all set up accept javascript and jquery in the form of coffee-script. While I'll learn coffee-script soon, right now all I've got is jquery.

More specifically, should I add something like:

<script type="text/javasript" src= "https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>

into the head of my app/views/layouts/application.html.erb file or is all that taken care of jquery-rails gem and the

<%= javascript_include_tag "application" %>

already there?

Where in my app do I put the jQuery code? With every new controller I generate, rails 3.2 creates a nice [new_controller].js.coffee file in the app/assets/javascripts/ directory. Javascript doesn't work if I put it in that .coffee file. Anyone have any thoughts?

like image 997
BenU Avatar asked Jul 07 '12 14:07

BenU


2 Answers

Having experimented around and corresponded with the good folks at Code School, I've come up with the following answer with others may find useful:

Rails 3.2 apps are ready made to accept coffeescript. Indeed, every new controller automatically generates a [new_controller].js.coffee file ready to accept one's new coffeescript. While I'll get to coffeescript soon enough, having just finished JQuery Air: First Flight, all I know is jQuery.

Here's what one needs to do to add jQuery to one's Rails 3.2 app with default, asset pipeline settings:

1) Place javascript_include_tag(:application) in the app/views/layouts/application.html.erb file. Code School's Adam Fortuna notes that it is typical to put that line in the footer which sounds like good advice. That probably allows the rest of the page to load before the javascript.

2) In the 'app/assets/javascripts/' directory create a new file with the suffix .js which in my case was user.js. Note: Do not name your jQuery file the same as the automatically created .js.coffee file or it will not be read, probably because the coffeescript file alone will be.

3) Add your jQuery javascript to that file to your heart's content! It's already part of your 3.2 app, included with the jquery-rails gem.

If others have insight into using jquery and javascript instead of coffee-script in a rails 3.2 app, please add. That said, my next step is to learn coffee-script!

like image 140
BenU Avatar answered Oct 19 '22 01:10

BenU


You don't need to do anything. Rails will get you jquery by default. if the extension of your file is not coffee then you won't need to use coffeescript.

You can read this to better understand the magic.

If you must add your own, you can write something like this:

<%= javascript_include_tag "http://example.com/main.js" %>

Read this to understand how javascript_include_tag works.

like image 41
davidrac Avatar answered Oct 19 '22 01:10

davidrac