What's your biggest current challenge? Have your say in Community Polls along the right column.

How to add an autocomplete address field to your forms in Shopify

How to add an autocomplete address field to your forms in Shopify

Zworthkey
Shopify Partner
5581 642 1583

Any one Know How?

Here is the Solution.

<div id="main" role="main">
      
      <script src="//maps.googleapis.com/maps/api/js?key=YOUR API KEY&amp;libraries=places&amp;callback=PlaceAutocompleteSearch" async="" defer=""></script>
<script>
  function PlaceAutocompleteSearch() {
    var input = document.getElementById('search-address');
    var autocomplete = new google.maps.places.Autocomplete(input);
  }
</script>
<div class="rte">
  
  <h2>Place Autocomplete Search</h2>
  <input type="text" id="search-address" value="" class="pac-target-input" placeholder="Enter a location" autocomplete="off">
  
</div>
<style>
  #search-address{
    width:100%;
    height: 30px;
  }
</style>
    </div>
Reply 1 (1)

Zworthkey
Shopify Partner
5581 642 1583

<div id="main" role="main">

<script src="//maps.googleapis.com/maps/api/js?key=YOUR API KEY&amp;libraries=places&amp;callback=PlaceAutocompleteSearch" async="" defer=""></script>
<script>
function PlaceAutocompleteSearch() {
var input = document.getElementById('search-address');
var autocomplete = new google.maps.places.Autocomplete(input);
}
</script>
<div class="rte">

<h2>Place Autocomplete Search</h2>
<input type="text" id="search-address" value="" class="pac-target-input" placeholder="Enter a location" autocomplete="off">

</div>

</div>