Why javascript only loads once ? (Rails 4)

85 views
Skip to first unread message

ITF-tkd

unread,
Aug 19, 2015, 7:07:39 PM8/19/15
to Ruby on Rails: Talk
Hi,

Can someone explain to me why is this behaviour please?


The code below only works if I reload the page. It does not work when the page is loaded through a link. I imagine 
that part of the problem is turbolink and ajax, then how do I solve this problem?  I did try to move  the javascript tag from the top to 
the bottom of the page in the application layout, but that gave me trouble. I am using cocoon and every time I want to use a nested 
attribute instead of a single copy I am getting multiple. An undesired feature. 

Thank you 
-Luis

This is my application.js


//= require jquery
//= require jquery-ui
//= require jquery_ujs
//= require turbolinks
//= require cocoon
//= require bootstrap.min.js
//= require_tree .



-- 
search_button.coffee
jQuery ->
  $
('.search-box').hide()  
  $
('.search-btn').click ->
    $
('.search-box').toggle("slow")



Walter Lee Davis

unread,
Aug 19, 2015, 8:11:00 PM8/19/15
to rubyonra...@googlegroups.com

On Aug 19, 2015, at 7:07 PM, ITF-tkd <luismc...@gmail.com> wrote:

> Hi,
>
> Can someone explain to me why is this behaviour please?
>
>
> The code below only works if I reload the page. It does not work when the page is loaded through a link. I imagine
> that part of the problem is turbolink and ajax, then how do I solve this problem? I did try to move the javascript tag from the top to
> the bottom of the page in the application layout, but that gave me trouble. I am using cocoon and every time I want to use a nested
> attribute instead of a single copy I am getting multiple. An undesired feature.
>
> Thank you
> -Luis
>
> This is my application.js
>
>
> //= require jquery
> //= require jquery-ui
> //= require jquery_ujs
> //= require turbolinks
> //= require cocoon
> //= require bootstrap.min.js
> //= require_tree .
>
>

Any time you see a JavaScript working when it is a fresh load (or reload) of the page, but not on a link, you are being trapped by Turbolinks. The best way to solve this is to wrap any functions in a listener on the page:change event, which is fired by Turbolinks both when the page is loaded (at the same time as dom:loaded) but also whenever TL has refreshed part of the page.

Walter

>
> --
> search_button.coffee
> jQuery ->
> $('.search-box').hide()
> $('.search-btn').click ->
> $('.search-box').toggle("slow")
>
>
>
>
> --
> You received this message because you are subscribed to the Google Groups "Ruby on Rails: Talk" group.
> To unsubscribe from this group and stop receiving emails from it, send an email to rubyonrails-ta...@googlegroups.com.
> To post to this group, send email to rubyonra...@googlegroups.com.
> To view this discussion on the web visit https://groups.google.com/d/msgid/rubyonrails-talk/a479d7ab-4741-480b-8743-f0bdec1695ac%40googlegroups.com.
> For more options, visit https://groups.google.com/d/optout.

Luis McDpugall

unread,
Aug 20, 2015, 7:38:38 AM8/20/15
to rubyonra...@googlegroups.com
Thank you Walter, that worked.

- Luis

Sent from my iPhone
> You received this message because you are subscribed to a topic in the Google Groups "Ruby on Rails: Talk" group.
> To unsubscribe from this topic, visit https://groups.google.com/d/topic/rubyonrails-talk/LO_5lg1-bKo/unsubscribe.
> To unsubscribe from this group and all its topics, send an email to rubyonrails-ta...@googlegroups.com.
> To post to this group, send email to rubyonra...@googlegroups.com.
> To view this discussion on the web visit https://groups.google.com/d/msgid/rubyonrails-talk/C246B864-0C2B-4264-95AC-290748ECB55E%40wdstudio.com.
Reply all
Reply to author
Forward
0 new messages