Igor Kromin |   Consultant. Coder. Blogger. Tinkerer. Gamer.

Not long ago I've written about how to use Google's Map AutoComplete API. Now I've been going through my code and refactoring it. The new method is more flexible and easier to use.

My changes rely on jQuery being part of your project.

This is what the initialisation code looks like now. Note that it does not search for any specific input element ID, instead it searches for all input elements that have the CSS class 'loc_autocomplete' and sets them up as an auto-completable field.
$(document).ready(function() {
if (typeof(google) != 'undefined') {
var options = {
types: ['(cities)']
$('input.loc_autocomplete').each(function(idx, el) {
new google.maps.places.Autocomplete(el, options);

In my HTML, I do something like this...
<input id="locationName" name="locationName" type="text" class="loc_autocomplete">

Any input element with the same CSS class will be initialised now.


Have comments or feedback on what I wrote? Please share them below!
comments powered by Disqus
Other posts you may like...