Thursday, 8 August 2013

Google maps places autocomplete

<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
<article>
    <p>
        <input type="text" id="address" style="width: 500px;"/>

        <script type="text/javascript" src="@Url.Content("http://maps.google.com/maps/api/js?sensor=false&libraries=places&language=en-AU")"></script>
        <script>
            var autocomplete = new google.maps.places.Autocomplete($("#address")[0], {});
            //autocomplete.setComponentRestrictions({ 'country': 'au' });
            //autocomplete.setComponentRestrictions({ 'country': 'us' });
            //autocomplete.setComponentRestrictions({ 'country': 'uk' });
            autocomplete.setComponentRestrictions({ 'country': 'in' });
            google.maps.event.addListener(autocomplete, 'place_changed', function () {
                var place = autocomplete.getPlace();
                alert('0: ' + place.address_components[0].long_name);
                alert('1: ' + place.address_components[1].short_name);
                alert('2: ' + place.address_components[2].short_name);
                alert('3: ' + place.address_components[3].long_name);
                alert('4: ' + place.address_components[4].long_name);
                alert('5: ' + place.address_components[5].long_name);
                alert('6: ' + place.address_components[6].long_name);
                alert('7: ' + place.address_components[7].long_name);
                console.log(place.address_components);
            });
        </script>
    </p>
</article>

No comments:

Post a Comment