I have a Rails 5 application and would very much like to use Turbolinks.
Within the application there are several PATCH ajax calls that simply update the server with new data, but do not need to worry about updating the state of the page.
Whenever these ajax requests return, Turbolinks refreshes the page and the browser scrolls to the top of the screen. This is not desirable behavior; it is much preferred that things just stay put where they are.
Disabling Turbolinks eliminates the problem.
Example (super basic) ajax call that causes the problem:
$.ajax({
method: "PATCH",
url: url,
data: obj
});
Is anyone else experiencing this or have any ideas on how to prevent the page scroll from occurring?
I found the answer here: Turbolinks documentation on Github.
Step 1: replace the usual document.ready with a custom turbolinks:load.
step 2: make sure to specify that the type is json
document.addEventListener('turbolinks:load', function() {
// your ajax code:
$.ajax({
method: 'PATCH',
url: url,
dataType: 'json'
})
}
Had the same problem and found a solution via another StackOverflow question.
The idea is to make a JS request to Rails (using the dataType and format options):
$.ajax({
method: "PATCH",
url: url,
dataType: 'script',
format: 'js',
data: obj
});
In your rails controller, simply respond to this JS call with:
respond_to do |format|
format.js
end
No page reload!
Add the data-no-turbolink=true attribute to the <a> triggering the AJAX call or the <body> tag.
See: https://github.com/turbolinks/turbolinks-classic/issues/19 Another SO post with a question similar to yours: Rails 4: disable Turbolinks in a specific page