(No comment was entered for this change.)

I got the same here too. My workaround is writing the data to a hidden text input though.

(No comment was entered for this change.)

Same problem
I am using same auto complete field in 2 different light box forms and second time it never works.
What to do?? 

Currently, the only way to unbind the autocomplete is by using google.maps.event.clearListeners and remove all "focus", "blur" and "keydown" events and then remove the .pac-container:

    google.maps.event.clearListeners(input, "focus");
    google.maps.event.clearListeners(input, "blur");
    google.maps.event.clearListeners(input, "keydown");

    $(".pac-container").hide();

But I'm afraid this might break if the internal calls change in one of the next API releases.

(No comment was entered for this change.)

Hey everybody !
I've found a simple ugly workaround which prevent autocomplete to go further "place_changed" callback, you just need to insert a runtime error and it will stop there.

    google.maps.event.addListener(autocomplete, 'place_changed', function() {
        var place = autocomplete1.getPlace();
        error(); // This is the runtime error, undefined function
    });

I've just tried it with FF, it doesn't stop the listeners, you can still reuse the form for example.

Is this issue still open?

Apparently 
autocomplete.unbindAll();
removes any listeners added to autocomplete.

google.maps.event.clearInstanceListeners(element);
removes any listeners added to input element.

Not sure if anything else needs to be done for full cleanup.

Is there any way to get corresponding '.pac-container' to given Autocomplete instance? I am working on angular app and after going back and forth views with such field, multiple '.pac-container' are spammed and left in DOM.

$scope.$on('$destroy',()=>{
	var instance = document.querySelector('.pac-container');

	autocomplete.unbindAll();
	google.maps.event.clearListeners(autocomplete);

	if(instance){
		instance.parentNode.removeChild(instance);
	}
});

Non of the solutions above works for me:

* autocomplete.unbindAll() // does not unbind any binging
* $(".pac-container").hide() //not sufficient
* $(".pac-container").remove() //works well if you have only one autocomplete on the page. If you have more, you disable all of them.

My workaround is to remove input element and recreate it again.

I have just opened similar issue. Is is about having possibility to enable/disable predictions as oppose to complete unbind as it is requested in this issue.  If any of these two issues will be implemented it might solve problem of the other issue.

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

So if you think it is interesting give it a vote, please.
Michal

Thx to [email protected] : 
  "google.maps.event.clearListeners(autocomplete);" worked like a charm for me.
It did allow me to unbind Google Autocomplete from my input.

I also used 
  $(".pac-container").remove();
to remove autocomplete on already retrieved results as well.

the $(".pac-container").remove() is not a solution. If you have multiple address pickers it removes everything. (in an angular app it's a real issue).

If you clear autocomplete listener then you don't need related DOM element too so Place API should take care of that or give the possibility to identify the "pac-container" element related to an autocomplete.

@[email protected] : 
How about targeting a precise ".pac-container", using an upper id/class for instance ?
Something like : 
  $("div#geo1 .pac-container").remove()
or
  $(".geo2 .pac-container").remove()
?

If the id/class is added by Places, and if we can have an access to this id, yes it can be a solution.

If the id is added by the dev, take the case where you have at least 2 input with Places on page load. How to be sure that it's the first .pac-container which should have the id corresponding to your first input ?

Parent of each .pac-container is element body – so you cannot find container over its ancestor. 

Do you really need to unbind predictions? Isn’t it enough just to hide them and later show them again?

This is my workaround:

Each container is created after instance of the Autocomplete service is created, e.g.: new google.maps.places.Autocomplete(…) or new google.maps.places.SearchBox(…). Now you can find just created .pac-container in the document, store reference to it and mark that container as already processes (for example by adding an arbitrary class on it). 

As long as you can guarantee that two Autocomplete services are not created at the same time or you can wait with creation of next service until .pac-container for previous service is found, you have sufficient control.  Now you can hide/show whole .pac-contained (with Angular: pacContainer.addClass('ng-hide'); to hide and pacContainer.removeClass('ng-hide'); to show predictions again).

Michal

Thanks for your help. Your "hide" workaround works only if you accept to have elements in your DOM which aren't related to your current state. And angular best practices recommend to clean your DOM on scope destroy.

Anyway, I found some workarounds too of course but nothing perfect. 
Places API generate DOM elements but does not take care of garbage collection and does not even let us do this garbage collection properly so there is an improvment to do here.

I completely agree with Matthieu's concerns. I'm working with autocomplete in not Angular, but Ember app and it generates a ton of DOM elements that have NO way to clean them up. This is a very serious oversight.

Sorry, forgot to mention, but if anyone wondered, I'm dealing with it now by removing all '.pac-container's and creating a new one every time an autocomplete input is focused. Don't even ask me how efficient it is.