3 ms·

Works great, but yeah this is the only thing preventing me from pushing it live right now (I already moved any page-specific JS to inside the body tags instead

by jarin 14y ago

Works great, but yeah this is the only thing preventing me from pushing it live right now (I already moved any page-specific JS to inside the body tags instead of in the head). I imagine you have to rebind all your $(function() {}) code to the page:update event (and maybe also leave it bound to document.ready for the initial page load??), but I'm not quite sure the best way to do that. Edit: ok is rough but it seems to work $(function() { alert("document.ready"); }); $(document).bind('page:change', function() { alert("page:change"); });

dmix 14y ago
I tried it out and binding to the pjax:end works. So just wrap any code called by document.ready into a separate function. Then bind it to both document.ready and: $(window).bind('pjax:end', -> # document ready code )
- jarin 14y ago
  Hmm that doesn't seem to work with turbolinks. page:change works, but it fires on every change, not just when the body contains the event. I tried making a pageLoad() function on pages that need extra functionality and then putting the following in the head: $(function() { pageLoad(); }); $(window).bind('page:change', function() { pageLoad(); }); However, it calls the originally set pageLoad() on every subsequent update. Maybe if there was some way to clear the function before it replaces the content?
- jrochkind1 14y ago
  Hmm, I wonder if there's any way to have an event on page:change that somehow _sends_ a document.ready trigger. So it will trigger all document.ready hooks, without any changes to the code hooking into document.ready (which of course could come from third-party dependencies you can't easily change to use page:change themselves, and which may not want to be changed to have turbolinks-related code in them). Might be easier if your code exclusively uses jquery's ready rather than native DOM onload or whatever. But yeah, either way, this is a bunch of added logic that can go wrong, I'm not super enthused about it myself.

by jarin 14y ago

dmix 14y ago

I tried it out and binding to the pjax:end works. So just wrap any code called by document.ready into a separate function. Then bind it to both document.ready and: $(window).bind('pjax:end', -> # document ready code )

jarin 14y ago
Hmm that doesn't seem to work with turbolinks. page:change works, but it fires on every change, not just when the body contains the event. I tried making a pageLoad() function on pages that need extra functionality and then putting the following in the head: $(function() { pageLoad(); }); $(window).bind('page:change', function() { pageLoad(); }); However, it calls the originally set pageLoad() on every subsequent update. Maybe if there was some way to clear the function before it replaces the content?
jrochkind1 14y ago
Hmm, I wonder if there's any way to have an event on page:change that somehow _sends_ a document.ready trigger. So it will trigger all document.ready hooks, without any changes to the code hooking into document.ready (which of course could come from third-party dependencies you can't easily change to use page:change themselves, and which may not want to be changed to have turbolinks-related code in them). Might be easier if your code exclusively uses jquery's ready rather than native DOM onload or whatever. But yeah, either way, this is a bunch of added logic that can go wrong, I'm not super enthused about it myself.