The Rails asset pipeline uses a feature called Turbolinks for serving faster CSS and JS assets to the browser. It works by using AJAX to re-load assets without refreshing the page. Unfortunately, it also can mess up scripts that work with the document ready event such as jQuery. The only way to make the assets work is with a hard refresh. Let's fix this.

Luckily for us the fix for this issue is fairly simple, though towards the bottom of the documentation. First we need to add a new gem to our Gemfile gem 'jquery-turbolinks' to add jQuery support for Turbolinks. Make sure to run bundle to reload your gems.

Next we need to add the jquery-turbolinks files into our application.js asset load order. Make sure to place //= require jquery.turbolinks exactly after //= require jquery and before //= require turbolinks for this to work correctly.

Application.js

//= require jquery
//= require jquery.turbolinks
//= require jquery_ujs
//= require bootstrap-sprockets
//= require turbolinks
//= require_tree .

Lastly, make sure to stop any running instances of the Rails server to reload your assets and environment. Then just restart the server with rails s. At this point everything should be up and running smoothly again.

Join the conversation

comments powered by Disqus