Uncaught TypeError: Невозможно прочитать свойство «событие» неопределенного использования Laravel 5.3

Question

Я новичок в laravel. Это мой код сценария. Я использую этот скрипт для получения местоположения в моем поле ввода.

<script type="text/javascript"> 


     google.maps.event.addDomListener(window, 'load', function() { 
     var places = new google.maps.places.Autocomplete(document.getElementById('job_location')); 
     google.maps.event.addListener(places, 'place_changed', function() { 
      var place = places.getPlace(); 
      var address = place.formatted_address; 
      var latitude = place.geometry.location.A; 
      var longitude = place.geometry.location.F; 
      var mesg = "Address: " + address; 
      mesg += "\nLatitude: " + latitude; 
      mesg += "\nLongitude: " + longitude; 
      $('#latitude').val(latitude); 
      $('#longitude').val(longitude); 
      // alert(mesg); 
     }); 
    }); 

Мой в положил Фейлд название "job_location" Но в консоли у меня есть ошибка, как этот

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

Пожалуйста, руководство меня.

Answer 1

Как использовать Google Maps поиска в вашем ввода текста Фейлд

1. Generae Api Key для вашего веб-Aplication
2. дать идентификатор для текста Фейлд как ид = «myAddress»

3. пасты следующего кода в конце blade.php, где вы должны Асесс местоположении

   <script> 
       function initialize() { 
   
       var input = document.getElementById('myAddress'); 
       var autocomplete = new google.maps.places.Autocomplete(input); 
       } 
   
   google.maps.event.addDomListener(window, 'load', initialize); 
       </script> 
   

4. Добавить эти строки в файле макета в mycase main.blade.php в теге

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

5. если вы в JQuery включают файл вы main.blade.php «в @yield (» page_scripts '), пожалуйста, удалите его. Наслаждайтесь :)

Answer 2

Пожалуйста, проверьте Google автозаполнения рабочий код:

 <label for="searchTextField">Please Insert an address:</label> 
     <br> 
     <input id="searchTextField" type="text" size="50"> 

    <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false&libraries=places"></script> 

    <script> 

     var input = document.getElementById('searchTextField'); 
var options = { 
    componentRestrictions: { 
     geocode:[] 
    } 
}; 

var autocomplete = new google.maps.places.Autocomplete(input, options); 

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> 

Здесь работает ссылка на это:

http://jsfiddle.net/uxvMF/39/

Благодаря