I have a form that implements a Google map with the Google places library (demo, as an aside, in JSFiddle, if I add gmaps.js as a script reference it won't work but if I add it as a script element in the HTML section the exact same script works fine) that looks like so:
<form action="#" method="post">
<table class='Information table table-bordered'>
<caption>Information</caption>
<colgroup>
<col width='100' />
<col/>
</colgroup>
<tbody>
<tr>
<th>Location</th>
<td>
<div class="input-append">
<input type="text" name="Lat" value="37.771424" />
<span class="add-on">lat.</span>
</div>
<div class="input-append">
<input type="text" name="Lng" value="-122.41332799999998" />
<span class="add-on">lng.</span>
</div>
</td>
</tr>
<tr>
<th>Map</th>
<td>
<div id="panel">
<form class="form-search">
<input type="text" class="input-medium search-query" autocomplete="off" id="target" placeholder="Search Box"/>
</form>
</div>
<div id="ScavengerMap"></div>
</td>
</tr>
</tbody>
</table>
</form>
With the following JavaScript:
var input = document.getElementById('target'),
searchBox = new google.maps.places.SearchBox(input),
map = new GMaps({
div: '#ScavengerMap',
lat: 37.771424,
lng: -122.41332799999998
});
google.maps.event.addListener(searchBox, 'places_changed', function () {
var places = searchBox.getPlaces(),
location;
if (places.length > 0) {
location = places[0].geometry.location;
map.removeMarkers();
map.setCenter(location.jb, location.kb);
map.addMarker({
lat: location.jb,
lng: location.kb,
title: "Slim\'s",
draggable: true,
dragend: function (e) {
var point = e.latLng;
$('input[name=Lat]').val(point.lat());
$('input[name=Lng]').val(point.lng());
}
});
$('input[name=Lat]').val(location.jb);
$('input[name=Lng]').val(location.kb);
}
});
map.addMarker({
lat: 37.771424,
lng: -122.41332799999998,
title: "Slim\'s",
draggable: true,
dragend: function (e) {
var point = e.latLng;
$('input[name=Lat]').val(point.lat());
$('input[name=Lng]').val(point.lng());
}
});
When you type something in the search box ("Slim's" for example) you will see a set of suggestions from the Google Places library. If you select one, it is supposed to draw a marker at that location, but instead I get these two errors:
too much recursion
[Break On This Error]
...))};sa(fg[E],function(a){var b=this.ua,c=Sf(a);b[c]&&(delete b[c],O[m](this,vf,a...
{main,places}.js (line 26)
too much recursion
[Break On This Error]
....route=function(a,b){Mf("directions",function(c){c.pi(a,b,!0)})};function P(a,b,...
The thing that I'm having a hard time working out is why. The code that is in this demo is a subset of the code in my project, but both present the same issue. I can't find any information about a Google Places Library or Google Maps API outage, and weirder still this exact same code worked as early as 2 weeks ago (the time I wrote it). Any ideas about how I could at least isolate the problem?