How to toggle the google-maps autocomplete on and off?

Question

I'm instantiating an autocomplete input for Google Maps API (level 3), like so:

var input = document.getElementById('szukanyAdres');
autocomplete = new google.maps.places.Autocomplete(input);
autocomplete.bindTo('bounds', map);

How to turn the autocompletion functionality on and off at runtime?

Answer 1

The solution of Dr.Molle doesn't work for me.

The solution I found is to clearListener and remove pac-container:

var autocomplete;
var autocompleteListener;
function disableGoogleAutocomplete() {
    if (autocomplete !== undefined) {
            google.maps.event.removeListener(autocompleteListener);
            google.maps.event.clearInstanceListeners(autocomplete);
            $(".pac-container").remove();

            console.log('disable autocomplete to GOOGLE');
     }
}
function enableGoogleAutocomplete() {
    autocomplete = new google.maps.places.Autocomplete($("#inputDiv input")[0], options);
    autocompleteListener = google.maps.event.addListener(autocomplete, 'place_changed', function() { ... }
    console.log('set autocomplete to GOOGLE');
}

Now I can switch on/off google places Autocomplete.

Answer 2

There are two elements related to the autocomplete

1. the input-element
2. a div that contains the list-entries. this div will be appended to the body and has the class "pac-container"

So what you can do: show or hide both elements by modifying their display-style.

---

When it's not possible to hide the input you may replace the input with a clone of the input, this will remove the autocomplete-functionality.

inputObject.parentNode.replaceChild(inputObject.cloneNode(true),input);

To restore the autocomplete do again what you want to do.

Answer 3

To remove all listeners added to autocomplete.

autocomplete.unbindAll();

To remove all listeners added to input element.

google.maps.event.clearInstanceListeners(input);

See https://code.google.com/p/gmaps-api-issues/issues/detail?id=3429