Forums › Forums › Search & Filter Pro › ACF Google Map not loading when using AJAX for search

Tagged: 

Viewing 3 posts - 1 through 3 (of 3 total)
  • Anonymous
    (Private)  May 17, 2017 at 10:19 am #109374

    Hi there,
    is there a fix to enable google maps to show up in search results when using ajax to filter?
    It’s working fine non-ajax and I get no errors

    Many thanks,
    Charlie

    Trevor
    (Private)  May 17, 2017 at 5:32 pm #109497

    This is a problem that affects Google Maps in many circumstances (for example in hidden tabs or accordions also).

    It is necessary to use this basic javascript code, plus your own, to make the maps think that the page has been re-sized (that is the trigger to draw or re-draw a map in Google’s map code):

    <script>(function ( $ ) {
  "use strict";
  $(document).on("sf:ajaxfinish", ".searchandfilter", function(){
    console.log("ajax complete");
    // code to trigger ACF map re-sizing here
  });
}(jQuery));</script>

    Somebody else suggested this might work:

    <script>(function ( $ ) {
  "use strict";
  $(document).on("sf:ajaxfinish", ".searchandfilter", function(){
    console.log("ajax complete");
    google.maps.event.trigger(map, 'resize');
    center_map(map);
  });
}(jQuery));</script>

    But this Google search might yield results if not:

    https://www.google.com/search?q=code+to+trigger+ACF+map+re-sizing

    Anonymous
    (Private)  May 18, 2017 at 7:35 pm #109830

    Thanks for your help Trevor – I had tried that code, but it doesn’t work for me. Have given up for now and resorted to non-ajax!

  • Author
    Posts
Viewing 3 posts - 1 through 3 (of 3 total)