Question

30

bind google places autocomplete on textbox without instantiating a google map

rated 0 times [ 31] [ 1] / answers: 1 / hits: 66126 / 12 Years ago, sun, august 19, 2012, 12:00:00

I'm trying to add Google Places Autocomplete on my Website. I'm having a problem with binding my search textbox with Autocomplete without the use of instantiating a google map. What I'm trying to do is, I want to use the autocomplete as a text suggestion on my search field. but sadly, all the tutorials I've seen had autcomplete being used along with a google map. Is there any way around this?

Thanks in advance.

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

elians

Add To Favorites

Follow

Total Points: 417

Total Questions: 87

Total Answers: 101

Location: Barbados

Member since Sun, Nov 27, 2022

2 Years ago

answered 12 Years ago martina · Accepted Answer

Guys you can use following code.

 <!DOCTYPE html>

    <html>

      <head>

        <link type=text/css rel=stylesheet href=https://fonts.googleapis.com/css?family=Roboto:300,400,500>

        <script src=https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false&libraries=places></script>

        <script>

            var autocomplete;

            function initialize() {

              autocomplete = new google.maps.places.Autocomplete(

                  /** @type {HTMLInputElement} */(document.getElementById('autocomplete')),

                  { types: ['geocode'] });

              google.maps.event.addListener(autocomplete, 'place_changed', function() {

              });

            }

        </script>

      </head>

      <body onload=initialize()>

        <div id=locationField>

          <input id=autocomplete placeholder=Enter your address onFocus=geolocate() type=text></input>

        </div>

      </body>

    </html>

Edit: Google Maps now require an API key for this to work.