JQuery gets loaded only on page refresh in Rails 4 application
Turbolinks are the problem here.Turbolinks are added in rails to improve performace of webpage.I have got this solution working
<%= link_to "Create New Form", sampleform_path, 'data-no-turbolink' => true %>
Fore more details refer this
Okay, I think I understand your problem enough to provide an answer. The thing about using turbolinks is that most plugins and libraries that bind to the document ready event stop working, since turbolinks prevents the browser from reloading the page. There are tricks to fix those issues, but the easiest way to fix it is to use jquery.turbolinks.
To use it, just add this to your Gemfile
:
gem 'jquery-turbolinks'
and this to your assets/javascripts/application.js
file:
//= require jquery.turbolinks
and you should be good to go.
FYI: You don't really need to use turbolinks, but it's useful and it makes requests faster by avoiding a full page refresh. Turbolinks fetches the contents of the link you clicked via AJAX and renders it on the same page, thus eliminating the overhead of reloading assets (JS and CSS). Try to make your page work with it. Using the library in the previous paragraph I've had no real issues. The more CSS and JS you have on your page, the bigger the improvement you get by using turbolinks.
I couldn't get things working until I followed both CodeWalrus's and Ian's answers, but for me there was more to it. As described on the jquery.turbolinks Readme, the order must be very specific.
//= require jquery
//= require jquery.turbolinks
//= require jquery_ujs
//
// ... your other scripts here ...
//
//= require turbolinks
Also, as described here, if you have put the application javascript link in the footer for speed optimization reasons, as I had, you will need to move it into the <head>
tag so that it loads before the content in the <body>
tag.
Ian had a good answer, and this one is an add-on of sorts to that (SO won't let me actually comment to anyone at time of writing.)
From https://github.com/rails/turbolinks/#jqueryturbolinks :
Add the gem [gem 'jquery-turbolinks'] to your project, then add the following line to your JavaScript manifest file, after jquery.js but before turbolinks.js:
//= require jquery.turbolinks
Before I hadn't added require jquery.turbolinks
in the right spot within the list, so it was being a bit picky. Then I added this a new way and I hope it works better.