最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

javascript - How to disable TurboLinks in Rails 6? - Stack Overflow

programmeradmin4浏览0评论

So I'm facing this problem where my server does actually retrieve the correct data from the client's request, sending this data to the browser where I can clearly see that its avaible for the browser (CTRL+SHIFT+C > Network > my_request). However, the browser doesn't refresh. So I'm now seeing the previous page's data. After searching for a bit, I determined it was caused by TurboLinks which I then tried to disable as done here or here. Yet the browser still won't refresh and show up the newly fetched data. The last thing I did was grep -r turbolink * in my project directory which gave me the following:

app/views/layouts/_dashboard_menu_certified.html.erb:          <%= submit_tag("Apply", {'data-turbolinks': false}) %>
log/development.log:    21:     <%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
node_modules/@rails/webpacker/README.md:<%= javascript_packs_with_chunks_tag 'calendar', 'map', 'data-turbolinks-track': 'reload' %>
node_modules/@rails/webpacker/README.md:<script src="/packs/vendor-16838bab065ae1e314.js" data-turbolinks-track="reload"></script>
node_modules/@rails/webpacker/README.md:<script src="/packs/calendar~runtime-16838bab065ae1e314.js" data-turbolinks-track="reload"></script>
node_modules/@rails/webpacker/README.md:<script src="/packs/calendar-1016838bab065ae1e314.js" data-turbolinks-track="reload"></script>
node_modules/@rails/webpacker/README.md:<script src="/packs/map~runtime-16838bab065ae1e314.js" data-turbolinks-track="reload"></script>
node_modules/@rails/webpacker/README.md:<script src="/packs/map-16838bab065ae1e314.js" data-turbolinks-track="reload"></script>
node_modules/@rails/webpacker/CHANGELOG.md:<%= stylesheet_packs_with_chunks_tag 'calendar', 'map', 'data-turbolinks-track': 'reload' %>
node_modules/@rails/webpacker/CHANGELOG.md:<%= javascript_packs_with_chunks_tag 'calendar', 'map', 'data-turbolinks-track': 'reload' %>
node_modules/@rails/webpacker/CHANGELOG.md:<script src="/packs/vendor-16838bab065ae1e314.js" data-turbolinks-track="reload"></script>
node_modules/@rails/webpacker/CHANGELOG.md:<script src="/packs/calendar~runtime-16838bab065ae1e314.js" data-turbolinks-track="reload"></script>
node_modules/@rails/webpacker/CHANGELOG.md:<script src="/packs/calendar-1016838bab065ae1e314.js" data-turbolinks-track="reload"></script>
node_modules/@rails/webpacker/CHANGELOG.md:<script src="/packs/map~runtime-16838bab065ae1e314.js" data-turbolinks-track="reload"></script>
node_modules/@rails/webpacker/CHANGELOG.md:<script src="/packs/map-16838bab065ae1e314.js" data-turbolinks-track="reload"></script>

Is there something I missed ? Cheers.

EDIT:

<div class="col-sm-6 card">
      <% @res.each do |tool, histories| %>
        <div class="chart">
          <div class="card-header">
            <div class="nav nav-pills card-header-pills">
              <%= tool %>
            </div>
          </div>
          <div class="card-body">
            <div id="<%= tool %>" class=""></div>
            <script>
              new Morris.Line({
              element: "<%= tool %>",
              data: [
                <% histories.each do |history| %>
                  { date: '<%= history.date %>', value: <%= history.uptodate %>, value2: <%= history.outdated %>, value3: <%= history.error %>},
                <% end %>
              ],
              xkey: 'date',
              ykeys: ['value', 'value2', 'value3'],
              labels: ['UpToDate', 'OutDated', 'Error']
              })
            </script>
          </div>
        </div>
      <% end %>
</div>

So I'm facing this problem where my server does actually retrieve the correct data from the client's request, sending this data to the browser where I can clearly see that its avaible for the browser (CTRL+SHIFT+C > Network > my_request). However, the browser doesn't refresh. So I'm now seeing the previous page's data. After searching for a bit, I determined it was caused by TurboLinks which I then tried to disable as done here or here. Yet the browser still won't refresh and show up the newly fetched data. The last thing I did was grep -r turbolink * in my project directory which gave me the following:

app/views/layouts/_dashboard_menu_certified.html.erb:          <%= submit_tag("Apply", {'data-turbolinks': false}) %>
log/development.log:    21:     <%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
node_modules/@rails/webpacker/README.md:<%= javascript_packs_with_chunks_tag 'calendar', 'map', 'data-turbolinks-track': 'reload' %>
node_modules/@rails/webpacker/README.md:<script src="/packs/vendor-16838bab065ae1e314.js" data-turbolinks-track="reload"></script>
node_modules/@rails/webpacker/README.md:<script src="/packs/calendar~runtime-16838bab065ae1e314.js" data-turbolinks-track="reload"></script>
node_modules/@rails/webpacker/README.md:<script src="/packs/calendar-1016838bab065ae1e314.js" data-turbolinks-track="reload"></script>
node_modules/@rails/webpacker/README.md:<script src="/packs/map~runtime-16838bab065ae1e314.js" data-turbolinks-track="reload"></script>
node_modules/@rails/webpacker/README.md:<script src="/packs/map-16838bab065ae1e314.js" data-turbolinks-track="reload"></script>
node_modules/@rails/webpacker/CHANGELOG.md:<%= stylesheet_packs_with_chunks_tag 'calendar', 'map', 'data-turbolinks-track': 'reload' %>
node_modules/@rails/webpacker/CHANGELOG.md:<%= javascript_packs_with_chunks_tag 'calendar', 'map', 'data-turbolinks-track': 'reload' %>
node_modules/@rails/webpacker/CHANGELOG.md:<script src="/packs/vendor-16838bab065ae1e314.js" data-turbolinks-track="reload"></script>
node_modules/@rails/webpacker/CHANGELOG.md:<script src="/packs/calendar~runtime-16838bab065ae1e314.js" data-turbolinks-track="reload"></script>
node_modules/@rails/webpacker/CHANGELOG.md:<script src="/packs/calendar-1016838bab065ae1e314.js" data-turbolinks-track="reload"></script>
node_modules/@rails/webpacker/CHANGELOG.md:<script src="/packs/map~runtime-16838bab065ae1e314.js" data-turbolinks-track="reload"></script>
node_modules/@rails/webpacker/CHANGELOG.md:<script src="/packs/map-16838bab065ae1e314.js" data-turbolinks-track="reload"></script>

Is there something I missed ? Cheers.

EDIT:

<div class="col-sm-6 card">
      <% @res.each do |tool, histories| %>
        <div class="chart">
          <div class="card-header">
            <div class="nav nav-pills card-header-pills">
              <%= tool %>
            </div>
          </div>
          <div class="card-body">
            <div id="<%= tool %>" class=""></div>
            <script>
              new Morris.Line({
              element: "<%= tool %>",
              data: [
                <% histories.each do |history| %>
                  { date: '<%= history.date %>', value: <%= history.uptodate %>, value2: <%= history.outdated %>, value3: <%= history.error %>},
                <% end %>
              ],
              xkey: 'date',
              ykeys: ['value', 'value2', 'value3'],
              labels: ['UpToDate', 'OutDated', 'Error']
              })
            </script>
          </div>
        </div>
      <% end %>
</div>
Share Improve this question edited Dec 12, 2019 at 15:02 HCKRMVT asked Dec 12, 2019 at 13:17 HCKRMVTHCKRMVT 4141 gold badge4 silver badges15 bronze badges 6
  • Please explain: do you click a link to start the action to retrieve the new data? Is it some javascript code? How does your controller code look? What are you rendering (a full page-view, a partial, how do you update part of the screen?), which rails version are you using? – nathanvda Commented Dec 12, 2019 at 14:00
  • I have this <%= form_with(url: "my_controller", method: "get") do %> with a <%= submit_tag("Apply", {'data-turbolinks': false}) %>. So the submit_tag is the one that triggers the query and thus the controller that either fills an array with the corresponding data or render's a template if the query from the form wasn't valid. What I'm rendering is a partial page where the newly fetched data should be displayed. As the question says, i'm running rails 6. – HCKRMVT Commented Dec 12, 2019 at 14:20
  • So if the data is valid, it fills an array, and how do you render/return this? It should still render a view to return the data. Can you show us that view? Are you using some kind of javascript framework to render the array/list client-side? – nathanvda Commented Dec 12, 2019 at 14:51
  • I render it the same way as the previous page with the previous data. And yes, I'm using Morris.js to create chart out of the data. – HCKRMVT Commented Dec 12, 2019 at 15:02
  • 1 Right, you say this as if I know what you mean with "the previous page with the previous data". Is that another form? Another page with another form? Have you got another page with a form_with that works? Then look for the differences? form_with is by default remote, maybe you need to add the option local: true ? – nathanvda Commented Dec 13, 2019 at 9:03
 |  Show 1 more ment

1 Answer 1

Reset to default 17
  1. Remove gem 'turbolinks', '~> 5' from Gemfile
  2. Remove //= require turbolinks from app/assets/javascript/application.js
  3. Remove , 'data-turbolinks-track': 'reload' (x2) from app/views/layouts/application.html.erb
  4. Run yarn remove turbolinks
  5. Run rails tmp:cache:clear

Step 4 is the main difference with Rails 5.

发布评论

评论列表(0)

  1. 暂无评论