Ruby on rails 4.0 + javascript not loading

Question

I have a javascript file called "front.js" i load from "application.js" like usual with this code:

//= require front

Inside "front.js",i have many functions i want to launch when the document is ready like this:

$(document).ready(function() {
  $("#test").click(function(event){
    ...
  });
});

But the problem is "front.js" is loaded only when i refresh the page manually (ctrl+r / f5 ) and not when i move from page to page, so my javascript code cannot be executed as wanted. Maybe this comes from turbolinks, i dont know how to handle this issue. When i put scripts directly in the html files, it works but it's definitely not the right thing to do.

Can anyone help me on this please ?

possible duplicate of [Rails 4: how to use $(document).ready() with turbo-links](http://stackoverflow.com/questions/18770517/rails-4-how-to-use-document-ready-with-turbo-links) — Roman Kiselenko, Apr 30 '14 at 09:48
Actually i didn't know if this problem came from Turbolinks or not. — dzof31, May 05 '14 at 12:35

score 3 · Accepted Answer · edited May 23 '17 at 11:59

There are three ways by which you can do it.

a. You can wrap your jquery code inside a function and then call that function on page load. If your function is ready then you can do:

$(document).ready(ready);
$(document).on('page:load', ready);

b. You can use jquery's live event or "on" event:

$(document).on("click","#test",function(){
 // your code
});

c. You can use the jquery-turbolinks gem which will bind the Rails Turbolink events to the document.ready events so you can write your jQuery in the usual way. For more information refer to here

score 2 · Answer 2 · answered Apr 30 '14 at 09:30

2

It's due to turbolinks, do this instead

var ready;
ready = function() {
  $("#test").click(function(event){
    ...
  });
};
$(document).ready(ready);
$(document).on('page:load', ready);

answered Apr 30 '14 at 09:30

Rajdeep Singh

17,621
6
53
78

score 1 · Answer 3 · answered Apr 30 '14 at 09:44

1

I had the same problem when using foundation in my project, you can disable turoblinks by not requiring turbolinks in your application.js file and it should solve the problem.

answered Apr 30 '14 at 09:44

Andrew_tainton

261
1
3
13

Also be sure to take out references to turbolinks in places like application.html.erb. Do a recursive grep search on your project to be sure you rip out all traces of of that "feature," and your JS may start working normally. – JosephK Nov 24 '15 at 09:23

Ruby on rails 4.0 + javascript not loading

3 Answers3

Linked