Skip to main content

International Address Autocomplete Widget Guide

The International Address Autocomplete Widget enables searching for verified addresses from a number different countries. it searches our international databases in realtime. Once an address is selected, the verified address is returned in standardised formatting and enriched with metadata.

The widget can be configured allowing you to specify the country you wish to search addresses from and what metadata is returned.

How to integrate

You’ll need access to update the website or form where you want to add the widget.

  1. Copy and paste the code snippet below into the HTML of your webpage, ideally just before the closing </body> tag.
  2. Replace your_license_key (placeholder) with your Addressfinder license key. You can find it in the Addressfinder Portal. If you don't have an Addressfinder account, sign up for a free trial today.
  3. Update the default country code with the 2-digit code of the country you wish search addresses from.
  4. Replace address, suburb (optional), city, state and postcode with the IDs of the corresponding fields where you require the address to be populated. Note, the address field is also used as both the address search field and the field into with the street part of the address is populated.
  5. Replace country with the ID of your country select field. When used, this field is tells the widget to search addresses from the selected country.
  6. Test.

International address autocomplete code snippet

International address autocomplete

<script>
(function (d) {

  var conf = {
    // STEP 2 - paste in your licence key
    licenceKey: "your_license_key",

    // STEP 3 - update the default country
    defaultCountryCode: "AU",

    // STEP 4 - update the property selectors using the ID attributes of your form fields
    addressSelector: "#address",
    suburbSelector: null,
    citySelector: "#city",
    stateSelector: "#state",
    postcodeSelector: "#postcode",
    countrySelector: "#country",

    // STEP 3 (optional): customise the addresses returned by updating the address_params values
    // Examples at: https://production2.addressfinder.com/nz.au/docs/widget_code_generator/
    countryConfig: {
      DEFAULT: {
        widgetOptions: {
          max_results: 7
        }
      }
    },

    // STEP 4: once the plugin is working, you can set debugMode to false
    debugMode: true
  };

  d.addEventListener("DOMContentLoaded",function(){if(d.querySelector(conf.addressSelector)){var e=d.createElement("script");e.src="https://api.addressfinder.io/assets/generic/v1/address.js",e.async=!0,e.onload=function(){new Addressfinder.Address.BootHandler(conf)},d.body.appendChild(e)}});
})(document);
</script>

Review some of the popular widget options and examples that might align with your needs.