Rails 5: how to use $(document).ready() with turbo-links

javascript jquery ruby-on-rails turbolinks ruby-on-rails-5
AndrewH picture AndrewH · Mar 20, 2016 · Viewed 55.9k times · Source

Turbolinks prevents normal $(document).ready() events from firing on all page visits besides the initial load, as discussed here and here. None of the solutions in the linked answers work with Rails 5, though. How can I run code on each page visit like in prior versions?

Answer

AndrewH picture AndrewH · Mar 20, 2016

Rather than listen to the ready event, you need to hook in to an event fired by Turbolinks for every page visit.

Unfortunately, Turbolinks 5 (which is the version that appears in Rails 5) has been re-written, and does not use the same event names as in previous versions of Turbolinks, causing the answers mentioned to fail. What works now is to listen to the turbolinks:load event like so:

$( document ).on('turbolinks:load', function() {
  console.log("It works on each visit!")
})

Related questions

Turbolinks causing a "jquery-ujs has already been loaded!" error

I have a newish Rails 4 app which contains no custom Javascript - the folders app/assets/javascripts, lib/assets/javascripts and vendor/assets/javascripts are all empty (apart from app/assets/javascripts/application.js). When I click around the app …

Read More
Rails 5 - turbolinks 5,some JS not loaded on page render

I have a Rails app, I recently updated to 5.0.0.RC1. Most of the transition went smooth, but I'm having some trouble with the new Turbolinks. In my app I for example use this gem: gem 'chosen-rails' My application.js file …

Read More
jQuery: how to change title of document during .ready()?

I am using some nested layouts in Ruby on Rails, and in one of the layouts i have a need to read in a string from a div and set that as the title of the document. What is correct …

Read More