Rails javascript працює тільки після перезавантаження

Проблема полягає саме в тому, що йдеться в заголовку. JavaScript знаходиться в конвеєрі активів, тобто в засобах/javascripts/myfile.js.coffee У application.js у мене є:

//= require jquery
//= require jquery_ujs
//= require turbolinks
//= require jquery.ui.all
//= requier twitter/bootstrap
//= require jasny-bootstrap
//= require_tree .

Це є coffeescript

$(document).ready ->
  $("#close").click ->
    $(this).parent().parent().slideUp("slow")




  $( "#datepicker" ).datepicker
    dateFormat : "yy-mm-dd"


  player_count = $("#player option").length


  $('#btn-add').click ->
    $('#users option:selected').each ->
      if player_count >= 8
        $('#select-reserve').append("
")
        $(this).remove()    
      else
        $('#player').append("
")
        $(this).remove()
        player_count++


  $('#btn-remove').click ->
    $('#player option:selected').each ->
      $('#users').append("
")
      $(this).remove()
      player_count--


  $('#btn-remove-reserve').click ->
    $('#select-reserve option:selected').each ->
      $('#users').append("
")
      $(this).remove()


  $("#submit").click ->
   $("select option").prop("selected", "selected")

Я бачу в вихідному коді браузера, що javaScript завантажений, але він працює тільки після перезавантаження сторінки.

46
У мене така ж проблема, хоча я не використовую CoffeeScript. pastebin.com/d5QKXydy
додано Автор Amaan, джерело

7 Відповіді

For turbolinks 5.0 you must use the turbolinks:load event, which is called the first time on page load and every time on a turbolink visit. More info: https://github.com/turbolinks/turbolinks#running-javascript-when-a-page-loads

Код CoffeeScript:

$(document).on 'turbolinks:load', ->
  my_func()

Код JavaScript:

document.addEventListener("turbolinks:load", function() {
  my_func();
})
54
додано
Дуже дякую!!!
додано Автор Ihor Khomiak, джерело
@MariaLuisa Я маю цю проблему і хочу поставити JavaScript і CoffeeScript в моє додаток, однак я не знаю, де поставити два кодові блоки. Ви можете сказати мені, куди їх покласти?
додано Автор user5783745, джерело
Я не міг змусити цього працювати. Але відповідь Джозефа Н. тут працювала для мене
додано Автор user5783745, джерело
Точна ж проблема, і я спеціально намагався з'ясувати, як змінити навантаження turbolink на одноразовій основі. Дякую!
додано Автор DNorthrup, джерело
Це єдиний, який буде працювати для мене на нових рельсах 5 додатків
додано Автор trueinViso, джерело
У мене є точна проблема, але їм за допомогою C# і asp.net. Чи можете ви запропонувати правильний сценарій для цього? Дякую
додано Автор wolfQueen, джерело
@wolfQueen asp.net і C# зазвичай використовуються на стороні сервера. Можливо, ви повинні шукати файли на стороні клієнта (це може бути на певних файлах .js або у вашому html, залежно від того, що ви намагаєтеся зробити)
додано Автор MrWater, джерело
Витрачені століття боролися з цим. Ви вирішили працювати для мене.
додано Автор Belder, джерело
Це єдине рішення, яке працювало для мене. Спасибі купу
додано Автор jDmendiola, джерело

Це була проблема turbolinks. Завдяки @zwippie, що веде мене у правильному напрямку! Рішення полягало в тому, щоб обернути мій coffeescript в цьому:

ready = ->
// functions

$(document).ready(ready)
$(document).on('page:load', ready)
29
додано
що означає -> означає?
додано Автор ocram, джерело
Це coffeescript, його синтаксис для функції.
додано Автор Jason Carty, джерело

Я припускаю, що це питання turbolinks.

Або вилучіть turbolinks з вашого проекту, або змініть сценарій на:

$(function() {
  initPage();
});
$(window).bind('page:change', function() {
  initPage();
});
function initPage() {
 //Page ready code...
}

Як згадано тут .

23
додано
Це рішення працювало для мене і Rails 5, але замість 'page: change' я використав 'turbolinks: load' .
додано Автор cdouble.bhuck, джерело

Щоб вирішити проблему, можна встановити jquery.turbolinks камін, не змінюючи свого JavaScript.

19
додано
Більше не працює з Rails 5. Див. Обговорення/56 - дорогоцінний камінь застарів.
додано Автор Winston Kotzan, джерело

Ви можете розмістити своє jquery.turbolink у потрібному місці

 //= require jQuery 
 //= require jquery.turbolinks 
 //= require jquery_ujs 
 //= require bootstrap-sprockets 
 //= require turbolinks

А в Gemfile можна встановити jquery-turbolinks gem

gem 'jquery-turbolinks'
9
додано
якщо у вас є запит, то турбо-посилання потім jquery.turbolinks генеруватимуть умову для створення перезавантажень. На мою думку, це найшвидша, найдешевша і правильна відповідь. додайте gem + insert у належному порядку у вимозі у app/assets/javascript/application.js
додано Автор Jerome, джерело

Рейки 5 Використовуйте gem і jquery.turbolinks

$( document ).on('turbolinks:load', function() {
 //your code
}
4
додано

Я намагаюся Rails 5.2 і виявив, що 'turbolinks: load' не завантажується при першому завантаженні сторінки. Це те, що мені потрібно було робити в моєму файлі CoffeeScript.

document.addEventListener('turbolinks:load', ->
  # ... CoffeeScript code here
)

if !Turbolinks?
  location.reload

Turbolinks.dispatch("turbolinks:load")
0
додано
ІТ КПІ - JavaScript
ІТ КПІ - JavaScript
504 учасників

співтовариство javascript розробників в Telegram