Rails 3 Javascript Not Working

Question

I have included Javascript with <%= javascript_include_tag "application" %> in my Rails 3.2 application. And, I have included the following CoffeeScript in the company.js.coffee file that is included in the final application.js file when run:

$("article h2 a").click (e) ->
    $("article div").hide()
    $(@hash).slideToggle()
    e.preventDefault()
$("article div:not(#1)").hide()

However, the script doesn't work at all, despite functioning in the original HTML file that it was copied from (albeit not in CoffeeScript). And, similarly, the AJAX form requests don't seem to be working either.

Does anyone know why this may be occurring? Is there something I'm missing?

Any errors in your dev console? Try throwing an alert("Yes it is working") in there. — Emil Ahlbäck
– Emil Ahlbäck, Commented Mar 18, 2012 at 22:53
I was only aware that you could run traditional rails commands in there. But, I tried literally adding a JS alert and it threw a no method error. Is that what you meant? Sorry, I'm a PHP programmer and rather new to Rails (especially 3.2). — Justin
– Justin, Commented Mar 18, 2012 at 22:59
The problem might also be that you're not waiting for the document to be loaded before running your script. You could try wrapping it in $(document).ready( -> ... or move the inclusion of javascript files to the end of your page (right before </body>) — Emil Ahlbäck
– Emil Ahlbäck, Commented Mar 18, 2012 at 23:05
Oh, yes, I tried doing that in the CoffeeScript file and same problem. And I also tried with the document.ready, but the error suggested that rails already put it there in the application.js, so including it in the company.js.coffee was redundant. Thanks for the suggestions though! — Justin
– Justin, Commented Mar 19, 2012 at 0:53

Justin · Accepted Answer · 2012-03-21 19:34:01Z

3

I finally found the answer (something I should have tried first). I assumed that rails was automatically including the $ -> opener in the application.js file when it included the other files in the asset folder. But it seems that you need to do it for each one. So, I just added $ -> before everything and it works now.

And a note for others reading with the same problem, be sure that the $ selector isn't being used by any other functions, else you'll need to do the full CoffeeScript JQuery function reference.

Thanks for all of the help!

answered Mar 21, 2012 at 19:34

Justin

1,9563 gold badges24 silver badges34 bronze badges

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

Comments

coletrain · Accepted Answer · 2012-03-19 03:06:59Z

1

This happened to me about a week ago here is my solutions. First I made sure my application.js file had this at the beginning of the file.

//= require jquery
//= require jquery_ujs
//= require_self
//= require_tree .

Another thing is make sure rails is not using the public directory. Sometimes you will have both public and assets but make sure you are telling rails to use assets. Rails 3.2 should automatically include that though. Open your config>>application.rb and check for the following.

# Enable the asset pipeline
config.assets.enabled = true
config.assets.version = '1.0'

answered Mar 19, 2012 at 3:06

coletrain

2,8371 gold badge38 silver badges44 bronze badges

1 Comment

Justin Over a year ago

The only thing I was missing in this list was the //= require_self, I added that, and it still didn't work. But that you for the tip!

brewster · Accepted Answer · 2012-03-18 23:07:28Z

0

if article represents an element id or class, you need to select it with .article or #article. i forget that all the time.

answered Mar 18, 2012 at 23:07

brewster

4,5128 gold badges50 silver badges72 bronze badges

3 Comments

Justin Over a year ago

I was just using it to select the HTML5 article tag in general, but let me try to add a class or ID and see if that works now...

Justin Over a year ago

No, same problem when I changed it from just article to #article in the CoffeeScript and changed it in the HTML.

brewster Over a year ago

are any of these elements being loaded via ajax? if so, you will need to use .on ($("article h2 a").on("click", (e) ->...

Dynamick · Accepted Answer · 2012-07-25 10:46:09Z

0

I've fixed the same problem by deleting all files in %RAILS_ROOT/lib/assets/ folder.

answered Jul 25, 2012 at 10:46

Dynamick

5464 silver badges3 bronze badges

Collectives™ on Stack Overflow

Rails 3 Javascript Not Working

4 Answers 4

Comments

1 Comment

3 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

1 Comment

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related