Once the Autoaddress control is initialised, you can pass in several settings to customize your experience.

There are two settings which are the minimum requirements to be used in your control these are elementId and your authentication method which can be either apiKey or token.


The below code snippets demonstrates how to initialise the Autoaddress control with the two different authentication approaches.

In this code for the apiKey approach:

Autoaddress is an object representing the Autoaddress plugin, and you initialize it with configuration options.

elementId  specifies the ID of the HTML element where the Autoaddress plugin will be rendered.

apiKey should be replaced with your actual API key from the Account Center.

<script type="text/javascript">  
var aa = Autoaddress({
  apiKey: "YOUR_KEY",
  elementId: "aa-control", 


Similarly for initialising the control with the token approach you simply replace the apiKey property with the token property.  You should never add both properties. To retrieve a token, please see our createToken API documentation. 

<script type="text/javascript">  
var aa = Autoaddress({
  token: "YOUR_TOKEN",
  elementId: "aa-control", 

Setting options

Below you will find several configuration settings that are currently available for use on the Javascript control.

<script type="text/javascript">  
var aa = Autoaddress({
  apiKey: "YOUR_KEY",
  elementId: "aa-control", 
  // Sample usage of setting additional settings on the control
  // Set language 
  language: "en",
  // Set country bias
  country: "IE",
  // Turn off form validation (Only used in AutoaddressForm integration type)
  validateOnChange: false,
  // Change integration type - default is "AutoaddressForm"
  integrationType: "CustomerFormInline",
  // Add callback to capture address result
  onAddressResult: function (result) {
     // Parse address from result and populate your own form.
     // Result will you give you access to the full Lookup API response.

Note: * indicates that this is Required

elementId *
ID of the html element to attach the Autoaddress control to. Ensure this already exists on the page.  I.e "aa-control"

Note: If your `integrationType` is "CustomerFormInline" then the HTML element you are selecting with `elementId` must be an `<input >` type element.
apiKey API key for accessing the Autoaddress service.  This can be found on the Account center. 



tokenAn alternative approach to authentication is to use a token generated through the "createToken" API. In this case you can pass token directly to the control as a setting and skip setting apiKey.stringNone
Change the layout of the form to suit your needs.  More details for each integration type can be found here.  

Select from
  1.  “AutoaddressForm”
  2. “Combo”
  3. “CustomerFormInline”
elementSelectorIdentify element by means other than ID such as class. E.G elementSelector: ".mydiv". Only required if elementId is not provided.
 I.e ".myContainer"
customerFieldIdID of div encapsulating existing address form. Used for hiding and showing the form.stringNone
customerFieldSelectorIdentify the customerField by means other than ID such as class. E.G customerFieldSelector: ".myForm"stringNone
validateOnChangeDefault is true. Use this option to run form validation on form change events i.e. onBlur.booleantrue
themeConfigure the styling for the js control. string"material-theme"
languageSet language to be used for the plugin. This will control the language of labels/text used within the Autoaddress control and configure API results if different languages are available.string“en”
countrySet a country value if you want to bias address search towards a particular country.string“IE”
latitudeAllows you to bias address search results to given coordinates.

i.e. 40.7128

longitudeAllows you to bias address search results to given coordinates.

i.e -74.0060