Rails, javascript no se carga después de hacer clic en link_to helper

Tengo problemas para cargar mi javascript cuando utilizo un link_to helper en rieles. Cuando ingreso manualmente la URL con 'localhost: 3000 / products / new' o recargo la página, se carga el javascript, pero cuando paso por un enlace como se escribe a continuación, jQuery $(document).readyno se carga en la nueva página.

Link_to, javascript no se carga cuando hago clic en este enlace:

<%= link_to "New Product", new_product_path %>

archivo products.js

$(document).ready(function() {
    alert("test");
});

Cualquier ayuda será muy apreciada. ¡Gracias por adelantado!

¿Estás usando Rails 4? (Descúbrelo haciendo rails -ven tu consola)

Este problema probablemente se deba a la nueva gema Turbolinks . Hace que su aplicación se comporte como una aplicación JavaScript de una sola página. Tiene algunos beneficios ( es más rápido ), pero desafortunadamente rompe algunos eventos existentes como $(document).ready()porque la página nunca se vuelve a cargar. Eso explicaría por qué JavaScript funciona cuando carga directamente la URL, pero no cuando navega a través de un link_to.

Aquí hay un RailsCast sobre Turbolinks.

Hay un par de soluciones. Puede usar jquery.turbolinks como una solución inmediata , o puede cambiar su $(document).ready()declaración para usar en su lugar el 'page:change'evento Turbolinks :

$(document).on('page:change', function() {
    // your stuff here
});

Alternativamente, puede hacer algo como esto para la compatibilidad con cargas de páginas regulares, así como con Turbolinks:

var ready = function() {
    // do stuff here.
};

$(document).ready(ready);
$(document).on('page:change', ready);

Si está usando Ruby on Rails> 5 (puede verificar ejecutando rails -ven la consola) use en 'turbolinks:load'lugar de'page:change'

$(document).on('turbolinks:load', ready); 

Tengo el mismo problema, pero jquery.turbolinks no ayudó. Noté que tengo que anular el método GET.

Ahí está mi muestra:

<%= link_to 'Edit', edit_interpreter_path(@interpreter), method: :get %>

Si está en los rieles 5 en lugar de 'page:change', debe usar 'turbolinks:load'así:

$(document).on('turbolinks:load', function() {
  // Should be called at each visit
})

Fuente: https://stackoverflow.com/a/36110790

También puede envolver su enlace con un div que especifique data-no-turbolink.

Ejemplo:

<div id="some-div" data-no-turbolink>
    <a href="/">Home (without Turbolinks)</a>
</div>

Fuente: https://github.com/rails/turbolinks

Asegúrese de no tener <script>etiquetas en línea . (Las etiquetas de secuencia de comandos en línea son malas con los enlaces turbo).

FWIW, de los documentos de Turbolinks , el evento más apropiado para capturar en lugar del $(document).readyis page:change.

page:load tiene una advertencia de que no se activa en las recargas de caché ...

Se ha cargado un nuevo elemento de cuerpo en DOM. No se activa en el reemplazo parcial o cuando se restaura una página desde la caché, para no disparar dos veces en el mismo cuerpo.

Y dado que Turbolinks solo está cambiando la vista, page:changees más apropiado.

La solución que resolvió mi problema fue agregar esta meta propiedad.

<meta name="turbolinks-visit-control" content="reload">

Esto asegura que las visitas a una determinada página siempre activarán una recarga completa.

Esto fue increíblemente útil para trabajar en una solución para resolver el problema que tenía con esto, https://github.com/turbolinks/turbolinks#reloading-when-assets-change .