Can't delete google autocomplete?

Question

var autocomplete = new google.maps.places.Autocomplete(input, { types: ['geocode'] }); 

How to remove it now?

There's autocomplete.unbindAll () "function, but it doesn’t remove the HTML for the drop-down list. I have a page that does a lot of ajaxy things, and because of this, dropdowns continue to be added even there is only one autocomplete at a given time on the page: |

Answer 1

Assuming this was initialized

 var autocomplete = new google.maps.places.Autocomplete(input, {types: ['geocode']}); var autocompleteLsr = google.maps.event.addListener(autocomplete, 'place_changed', function() { ... }); 

The google APIs also provide removeListener and clearInstanceListeners for removal. https://developers.google.com/maps/documentation/javascript/reference#event

as well as an optional step, you must also remove this $ (". pac-container")

 google.maps.event.removeListener(autocompleteLsr); google.maps.event.clearInstanceListeners(autocomplete); $(".pac-container").remove(); 

Answer 2

Despite the fact that this is an old post, I would like to answer it now, as this will help someone.

Removing listeners or unbindall () in an autocomplete instance will not remove autosave suggestions and removing ".pac-container" from the DOM is not a clean solution.

A new autocomplete instance means that the input element is connected to an autocomplete instance, so we need to clear the listeners from the input element, and not from the autocomplete instance.

google.maps.event.clearInstanceListeners (login);

Answer 3

Where would you now call autocomplete.unbindAll() (also?) Call input.parentNode.removeChild(input) ? This, in essence, is what happens in the excellent answer to What is the right way to completely remove GoogleMaps autocomplete?

However, unlike this question, you are complaining about "several drop-down boxes."

It seems that your real problem is that you call new google.maps.places.Autocomplete(...) more than once, against different input nodes. Can't you avoid this? Where you create a new node, just drag the “initialized” node to the place in the document where you want to use it using the JS DOM API. Hide it if you want it to disappear temporarily.

It seems a bit trickier if you use the binding framework, but you should get this new Autocomplete from what it does. Somehow.