简体   繁体   中英

Pjax and reloading JavaScript on a specific page

I want to implement Pjax and Google Map in my Rails app and I have a problem with the reloading of my JavaScript codes.

My layout/application.html.erb is like this :

<body>
  <%= render 'shared/navbar' %>
  <%= render 'shared/flashes' %>
  <div id="pjax-container">
    <%= yield %>
  </div>
  <%= render 'shared/footer' %>

  <%= javascript_include_tag "https://maps.google.com/maps/api/js?key=******************************" %>
  <%= javascript_include_tag "https://google-maps-utility-library-v3.googlecode.com/svn/tags/markerclustererplus/2.0.14/src/markerclusterer_packed.js" %>

  <%= javascript_include_tag "application" %>

  <%= yield(:after_js) %>
</body>

and the file where is my map listings/index.html.erb is like this :

<div id="map" style="width: 100%; height: 300px;"></div>

<% content_for(:after_js) do %>
  <%= javascript_tag do %>

    $(document).on('ready', function() {
      handler = Gmaps.build('Google');
      handler.buildMap({ internal: { id: 'map' } }, function(){
        markers = handler.addMarkers(<%= raw @markers.to_json %>);
        handler.bounds.extendWith(markers);
        handler.fitMapToBounds();
      });
    })
  <% end %>
<% end %>

@markers is an array of the marker linked to a listing. It is defined in the Listings Controller, so it's difficult to move this javascript code.

The JavaScript code of this file works just when I reload this specific page, and it does not disappear when I change of page.

So my question is : Is it possible to call a JavaScript code, containing some ruby information, on a specific page with the Pjax system ?

只需在 pjax 的成功函数中加载您的 javascript。

okay i will explain more about the solution. :)

in PJAX, most of the time it doesn't load the Jquery or js which is included to the outside of the pjax funciton but in same. so we have to load that js file in the success funciton of the pjax function using

$getScript('Your js fle');

so that when pjax fetch new page content then the plugin also loaded and included.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM