Try it yourself

Type an address and see the autocomplete in action.

Selected address

Select an address to see the result

Lookup mode

Enter a postal code and house number, street and city are filled in automatically.

API response

Enter a postal code to see the result

Two ways to integrate

Choose between two types of integrations, see below for examples or check the documentation

Data Attributes

Zero JavaScript

Add data attributes to an input and it works instantly. No JavaScript needed.

<!-- Load the script -->
<script src="/places-autocomplete.js"></script>

<!-- Add data attributes -->
<input
  type="text"
  data-places-autocomplete
  data-places-api-key="pk_live_xxx"
  data-places-country="NL,BE,LU"
/>

JavaScript API

Full control

Initialize via JavaScript for more control over options and behavior.

const input =
  document.getElementById("address");

PlacesAutocomplete.init(input, {
  apiKey: "pk_live_xxx",
  country: "NL,BE,LU",
  limit: 5
});

input.addEventListener("places:select",
  (e) => console.log(e.detail)
);

Ready to integrate?

Create a free account and get an API key immediately.