I have two filter dropdowns on this site which will only trigger the first time I press them. According to my studies it seems that it has to do with turbolinks, which I've disabled by adding data-no-turbolink to the body tag like so:
<body data-no-turbolink>
...
</body>
I've also tried adding this to all of the dropdown links and the link to open the dropdown.
<a href="some-link" data-no-turbolink>...</a>
It seems to work on development, but when I push to Heroku, it seems turbolinks are running again. Any suggestions?
If Turbolinks is an issue, it can be removed entirely from the project by following the instructions provided e.g. here:
remove gem 'turbolinks' from the Gemfile and run bundle update
remove //= require turbolinks from app/assets/javascripts/application.js
remove "data-turbolinks-track" => true from the stylesheet and javascript tags in the header of application.html.erb layout file.
Quoting Rails 4 In Action:
...it's our opinion that Turoblinks is great to speed up
mostly-server-side sites, but as soon as you start writing some
JavaScript, it causes more problems than it's worth.
Related
I am still new to Turbolinks and unsure whether it is working correctly. I have a new rails app that I've created with Turbolinks enabled by default. I am using the link_to rails helper to build some links. When I click on one of the links the page reloads in the browser. I was under the impression that this should not occur as only the body should be swapped using AJAX. Is there any additional attributes I need to add to my link or additional configuration I need to set up?
Make sure that you have the Turbolinks js loaded in the page. If you are using webpacker and removed the default application js that used the asset pipeline you will probably need to use Turbolinks from npm, import it and then call Turbolinks.start() in your entry file.
I've read through the other available questions and answers and they don't solve my issue. I recently looked to remove turbolinks from my project because I was having problems setting up event listeners. Suggestions for modifying the jquery to use the turbolinks equivalents weren't working, so I decided to remove it entirely for now to unblock myself.
I've done the following:
Remove the gem from Gemfile
Bundle (confirmed in the bundle turbolinks is no longer listed)
Removed turbolinks attributes from links in the head
Removed the require from the application JS
Restored my JS file to the original jQuery implementation
However, the problem persists on production (Heroku). Everything continues to work locally. I was inspecting the source assets on production and noticed I can find traces of turbolinks in the compiled js file. I don't know if this is causing the problem and I don't know where it's coming from so I haven't been able to remove it to test.
My JS file is set up like so:
$(document).ready(function() {
console.log('Listener setup working...');
....
Any ideas greatly appreciated.
I am developing in Ruby on Rails.
I get many turbolinks when I use browser back like this.
have many turbolinks linke this
Although I move page by clicking a tag, I have no turbolinks.
Only I use browser back, I have many turbolinks loading and reload webpage many times.
How can I browser back smoothly just like I click a tag.
SO! not clear your question, for suggestion if you do not need turbolinks on your application then remove the gem 'turbolinks' from Gemfile update the bundle and remove //= require turbolinks this line from assets/application.js and finally restart the server.
Number 2
If need to disable turbolinks for specific link then use data-turbolinks="false" for this link which you need to not use turbolinks like below
Disabled
See more about turbolinks on there documentation
Hope it helps
After I've precompiled assets and uploaded them to CDN I decided to turn on turbolinks. They were kind of turned on before when I were precompiling assets, that is I had gem turbolinks in Gemfile and require turbolinks in application.js but in application.html I had data-no-turbolink instead of data-turbolinks-track" => true.
Now I change it to data-no-turbolink to data-turbolinks-track" => true and expect them to work in production on the my local machine but it seems they aren't. Visually it seems they aren't working and "initiator" in the browser isn't turbolinks.
I don't want to recompile the assets if it's not really needed because reuploading them to CDN takes a lot of time.
So do I have to recompile them? Or perhaps I just don't notice that they are really working already?
data-turbolinks-track is only for asset tracking (to make sure the loaded assets file is the latest). It does not affect whether Turbolinks is used for a particular link.
If turbolinks is installed, any internal link without data-no-turbolink will be loaded using Turbolinks UJS.
The following code will fire an alert if Turbolinks is running.
$(document).on('page:load', function(){ alert("Turbolinks is active"); });
Not easy with the sparse information you provide. But here are some notes worth considering:
About Turbolinks:
With Turbolinks pages will change without a full reload, so you can't
rely on DOMContentLoaded or jQuery.ready() to trigger your code.
Instead Turbolinks fires events on document to provide hooks into the
lifecycle of the page.
You probably use jQuery? Read above link to understand. A good solution is this one: jQuery.turbolinks
...
But if you have a large codebase with lots of $(el).bind(...)
Turbolinks will surprise you. Most part of your JavaScripts will stop
working in usual way. It's because the nodes on which you bind events
no longer exist.
...
Firefox is firing off two requests when I click on the following button (and all other ajax forms on the page):
<%= form_tag(action_object_path, :remote => true) do -%>
<div><%= submit_tag "run process" %></div>
<% end -%>
I do not want this behavior. I pulled up firebug and can see that there are two requests made:
POST http://localhost:3000/object/1/action jquery.js?body=1 (line 8527)
POST http://localhost:3000/object/1/action application.js?body=1 (line 8527)
How do I fix this to only fire one request when I click my button?
One thing I remember that may help diagnose this problem. I know they are both javascript assets and can vaguely remember modifying something with my assets immediately after I started building my app because rails server barked at me and told me to precompile (I at least think it was precompile) my assets. I don't remember what I did and so dont' know how to reverse it.
I also read somewhere that firefox's cache may cause it to fire two requests, so I have tried clearing my cache and that does not work.
Thanks
To explain the problem a bit more clearly than the comments indicate:
The jquery-ujs javascript library adds event bindings to change events for elements that would normally generate standard HTTP requests (and are flagged as :remote) into AJAX requests. In Rails you would typically have the jquery-rails gem installed and then have the jquery_ujs.js file render in one of several ways:
add a require jquery_ujs line in your application.js manifest
add a javascript_include_tag :jquery_ujs line to your application layout file
copy the jquery_ujs file to your assets and rely on some line in the application.js manifest to pull it in (e.g. require_tree .)
Choosing more than one of these methods will cause the library to be linked twice - and will result in the symptoms described.