Skip to content

Google Maps api is not working for Php Laravel Framework after Refreshing the page

Muhammad Sipra

I want to use google maps Api for search purposes in my application to do this i do the following things. I have included JavaScript code at the bottom of my Blade file. Here is my JavaScript for

    <script>
    function initialize() {

    var input = document.getElementById('myAddressBar');
    var autocomplete = new google.maps.places.Autocomplete(input);
     }

   google.maps.event.addDomListener(window, 'load', initialize);
   </script>

And i have included the Google Api with my key like this in my head Tag 

   <script src="js/jquery.min.js"></script>

   <script src="https://maps.googleapis.com/maps/api/js?  key=AIzaSyBROO3Md6_fZD5_fd1u8VTlRxd4VdJnAWU&libraries=places"
        async defer></script>
   <script>
  function initMap(){}
  </script>

But problem is that it is works when i login or logout. As i refresh the page the following error comes to console 

   (index):581 Uncaught TypeError: Cannot read property 'event' of undefined

Any clue about this problem?

Advertisement

Answer

1.Change your script to

   <script>

   var input = document.getElementById('myAddressBar');
   var autocomplete = new google.maps.places.Autocomplete(input);

    google.maps.event.addListener(autocomplete, 'place_changed',   function () {

      var place = autocomplete.getPlace();
      var lat = place.geometry.location.lat();
      var long = place.geometry.location.lng();
      alert(lat + ", " + long);

  });

   </script>

  1. change the inclusion line to your h

I hope it will help you for more details check out this link