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.
Related
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.
...
When I press for example a link it redirects to this URL, but does not open full. It loads(loader gif moves). But when I press reload again - it loads. What is a problem? Can anyone saw such thing? How can I fix it?
Open Developer Tools in your browser and look at section of loading resources. For example here is Network Monitor of Firefox. It help you to investigate reason of problem. Probably some third-party resources isn't loading.
As mentioned by #maxd, use the Network Monitor in Firefox or Chrome Dev Tools to investigate further.
It sounds like the issue could be caused by the turbolinks gem conflicting with jQuery. Try removing turbolinks and restarting your local server to see if the problem persists.
Remove the following lines:
Gemfile: gem 'turbolinks'
application.js: //= require turbolinks
application.html.erb: "data-turbolinks-track => true"
Alternatively, if you want to use turbolinks, you can implement the jquery-turbolinks gem into your app.
Okay I am running into a bit of an issue. When I am using the gem the page renders as below. However when I include the link to the actual bootstrap css stylesheet, the navbar shows up correctly. Any idea what could be causing this problem? I have overridden nothing and don't intend on doing so.
This was my own fault. Assets weren't being loaded since I hadn't restarted my rails server after making some changes to the gem file..
I started building a rails project that uses jquery-datatables-rails. When I put that into my Gemfile I did NOT put it into the assets group. Everything worked fine in development. When I went to put it into production I re-read the documentation and saw that it should be in the assets group so I moved that line in my Gemfile. Then I performed a rake assets:precompile and then ran rails server -e production.
The datatable doesn't work. In fact, the only way I can make it work is to take that line out of the assets group in my Gemfile and run in development mode. I've read a lot of conflicting information on the Internet about this.
Did I screw anything up by moving the line from outside the assets group into the assets group? I would like to be able to run this in production and I want to have a Gemfile that is consistent with the jquery-datatables-rails documentation.
A while back in response to a different problem that I was having, I moved require twitter/bootstrap above require jquery in app/assets/javascripts/application.js. As a result the javascript wasn't working right. Moving it into the right place solved the problem and inexplicably did not cause the old problem to return.
So the fix is, make sure that jquery is at the top of your application.js file.
I'm trying to get pjax to work on a Rails app but none of the links are being annotated with pjax. I think pjax isn't really being loaded. I'm using pjax_rails and am basically following the railscast instructions but using //= require jquery.pjax instead of just pjax. I'm also using it with bootstrap which may cause an issue but I'm not sure. My other thought is that is that the pjax javascript isn't being loaded and I need to run something like $('a').pjax('[data-pjax-container]')
To be clear the main problem is that pjax isn't being loaded client side and thus when I make requests the X-PJAX header is not being set.
Finally got it working. First problem was that the unbeknownst to me the assests pipeline was turned off so the pjax javascript file wasn't being included. Instead I went with the pjax rack gem and dumped it into the public directory. Then I created a new javascript file with $('a').pjax('[data-pjax-container]') and it works! Although I'm not sure why I need to manually call that javascript when all the documentation seems to point to the fact that it should be already there.