14

I am trying to attach a virtual keyboard to bind to a Google places autocomplete input.

If I physically type in a letter in the input, a Google-powered dropdown displays the autocomplete predictions based on where the map is centered. If I click on a virtual keyboard key, the input gets updated properly, but the autocomplete predictions are not updated.

I have tried to use the virtual keyboard change callback to trigger a "keyup" (stackoverflow results), "keypress", "keydown", "change" and I even tried this (demo):

change : function(e, keyboard, el) {
    google.maps.event.trigger(autocomplete, 'place_changed');
}

which results in a javascript error basically showing that autocomplete.getPlace(); does not return a result.

So now I've tried the code below (in this demo), which uses the change callback to trigger an autocomplete prediction, but as you can see in that demo, the results differ.

change : function(e, keyboard, el) {
  var $el = $(el),
      service = new google.maps.places.AutocompleteService();
  if ($el.val() !== "") {
    service.getQueryPredictions({ input: $(el).val() }, function(predictions, status) {
      if (status != google.maps.places.PlacesServiceStatus.OK) {
        alert(status);
        return;
      }
      var list = '', $results = $('#results');
      for (var i = 0, prediction; prediction = predictions[i]; i++) {
        list += '<li>' + prediction.description + '</li>';
      }
      $results.html(list);
    });
  }
}

Ideally, I want to trigger the already established autocomplete prediction dropdown to update while typing on the virtual keyboard.

Mottie
  • 84,355
  • 30
  • 126
  • 241
  • Does this answer your question? [How to avoid need for end-user to manually start the Google Places Autocomplete dropdown?](https://stackoverflow.com/questions/9892092/how-to-avoid-need-for-end-user-to-manually-start-the-google-places-autocomplete) – Alex R Oct 11 '20 at 22:43

1 Answers1

11

I found my answer (demo)!

change : function(e, keyboard, el) {
    google.maps.event.trigger( el, 'focus', {} );
}
Mottie
  • 84,355
  • 30
  • 126
  • 241
  • Dude, you ended up hours of wandering among Google's API. Thank you very much! – Alexandre Bourlier May 29 '15 at 15:30
  • 1
    Did you guys figure out how to trigger the change when I click on the autocomplete results? I can get the 'focus' to trigger and display the results but now when I click on the results, they don't go away. – nf071590 Jun 21 '16 at 19:21
  • @nf071590 I've got the same problem because I use `usePreview: true,`, when I set it to false its working fine – koceeng Oct 06 '18 at 04:53
  • This doesn't seem to work anymore unless you add a delay, see also: https://stackoverflow.com/questions/9892092/how-to-avoid-need-for-end-user-to-manually-start-the-google-places-autocomplete?noredirect=1&lq=1 – Alex R Oct 11 '20 at 22:43