Loading...
Sign in to see the examples with your own API key.

JavaScript Autocomplete

Add as-you-type Australian address completion to any HTML form. It attaches to a field you already have and fills the rest of the form — no framework and no build step.

Install from NPM or CDN

npm install getaddress-au-autocomplete
<script src="https://cdn.getaddress.io/scripts/getaddress-au-autocomplete-1.9.0.js"></script>

Usage

<label for="address_line_1">Address line 1</label>
<input id="address_line_1" type="text">

<label for="address_line_2">Address line 2</label>
<input id="address_line_2" type="text">

<label for="suburb">Suburb</label>
<input id="suburb" type="text">

<label for="state">State</label>
<input id="state" type="text">

<label for="postcode">Postcode</label>
<input id="postcode" type="text">

<script>
    getAddressAu.autocomplete('address_line_1', '{your-domain-token}', {
        output_fields: {
            address_line_1: 'address_line_1',
            address_line_2: 'address_line_2',
            locality_name: 'suburb',
            state: 'state',
            postcode: 'postcode'
        }
    });
</script>

From npm:

import { autocomplete } from 'getaddress-au-autocomplete';

autocomplete('address_line_1', '{your-domain-token}', { /* options */ });

Suggestions are free and rate limited. Only resolving a picked suggestion to a full address counts as a look-up; set enable_get: false if you only need the one-line address and the widget never spends one.

Events

input.addEventListener('getaddress-au-autocomplete-suggestions', e => console.log(e.suggestions));
input.addEventListener('getaddress-au-autocomplete-suggestion-selected', e => console.log(e.suggestion));
input.addEventListener('getaddress-au-autocomplete-address-selected', e => console.log(e.address));
input.addEventListener('getaddress-au-autocomplete-address-selected-failed', e => console.log(e.error.message));

Options

OptionDefaultWhat it does
output_fields–Address fields to write into your form: field name → element id, CSS selector or element.
selected–Called with the full address once resolved.
suggestion_selected–Called the moment a suggestion is picked, before the look-up.
errorlogsCalled when a request fails.
enable_gettrueResolve the picked suggestion. false keeps the widget entirely free.
set_input_valuetrueWrite the first address line back into the attached input.
min_characters2Characters before the first request.
debounce_ms150Quiet period before a request is sent. Left unset, it lengthens on a slow connection (up to 500). Set it to fix the delay.
max_suggestions6Maximum suggestions shown. The API returns at most 6.
state–Restrict to one state, e.g. "NSW".
postcode–Restrict to one postcode.
location–[latitude, longitude] to bias results towards. Nothing is excluded.
inject_stylestrueInject the default stylesheet.
class_names–Override the class names on the elements the widget creates.

Address fields

output_fields keys are the Get API's field names — G-NAF's own: address_label, address_detail_pid, address_site_name, address_status, alias_principal, building_name, cleaning_provenance, date_created, flat_type, flat_number, geocode_type, legal_parcel_id, level_type, level_number, locality_name, lot_number, mb_code, number_first, number_last, postcode, primary_pid, primary_secondary, principal_pid, state, street_name, street_suffix, street_type — plus latitude and longitude.

address_line_1 and address_line_2 are composed from the parts, because G-NAF has no printed lines: a building or unit on line 1 with the street on line 2 ("Unit 2" / "14 Stirling Street"), or the street on line 1 and an empty line 2.

Styling

.getaddress-au-autocomplete {
    --gaau-bg: #fff;
    --gaau-border: #d7d9e3;
    --gaau-text: #1f2033;
    --gaau-hover-bg: #f2f3f9;
    --gaau-match: #4338ca;
    --gaau-radius: 6px;
}

Checking a whole address

For an address that arrives on one line — pasted, imported, or typed into a single box — the same package's validate() confirms it with the Validate API.

const result = await getAddressAu.validate('12 Acland St, St Kilda VIC 3182', '{your-domain-token}');

if (result.status === 'found') console.log(result.address.address_label);   // one look-up
if (result.status === 'ambiguous') console.log(result.candidates);          // ids, free

Reverse geocoding

The same package's nearest() finds the addresses nearest a point — a map pin, or a “use my location” button — with the Nearest API. One look-up when it finds one.

const [here] = await getAddressAu.nearest(latitude, longitude, '{your-domain-token}');

if (here) console.log(here.address, here.distance);   // pass here.id to /get for the full address

Businesses, ABNs and ACNs

The same package's companies() attaches business suggestions — by name, ABN or ACN, from the Companies API — to an input. Each shows the name with its ABN, state and postcode. Suggestions are free; picking one resolves the record with the Company API (one look-up; enable_get: false keeps it free).

<input id="business_name" type="text">
<input id="abn" type="text">

<script>
    getAddressAu.companies('business_name', '{your-domain-token}', {
        state: 'VIC',                                   // optional
        output_fields: { abn: 'abn', acn: 'acn' },
        selected: company => console.log(company.name, company.entity_type, company.gst_registered)
    });
</script>

The business on Google. With the Google add-on on, the widget also looks the picked business up on Google, in the visitor's browser with your own Google key, and adds it as company.google: place_id, name, address, latitude, longitude, type, website and phone. It keeps only a sure match: the place must be in the record's postcode and carry every word of its name, and a chain is matched only to its one head office, never a store. Otherwise company.google is null; many businesses (holding companies, trusts) have no place to find. Google bills your Google account for one Text Search per pick; google_match: false turns it off, and selected waits at most google_timeout_ms (3000) for it. Google's terms apply: show the data with Google's attribution and keep no more than the place id.

company.google.address_record is Google's address in parts, in the same shape get() returns (number, street, suburb, state, postcode, unit, coordinates), marked cleaning_provenance {"Source":"GOOGLE"}; what only G-NAF knows is empty. With google_validate: true the widget also checks it against G-NAF with validate() and adds the official record as company.google.gnaf, with gnaf_level address, or building when G-NAF does not list the unit or floor. That costs one look-up when found, nothing when not; gnaf is null when G-NAF has no single match (a building with several numbered entrances, for one).

Its events are getaddressau-company-suggestions, getaddressau-company-suggestion-selected, getaddressau-company-selected (e.company is the record) and getaddressau-company-selected-failed. Without a widget, suggestCompanies() and company() are promises:

const suggestions = await getAddressAu.suggestCompanies('bbc hardw', '{your-domain-token}', { state: 'VIC' });   // free
const record = await getAddressAu.company('000 003 378', '{your-domain-token}');                                 // one look-up

Distance

The same package's distance() measures straight-line metres between two addresses — their ids, as a suggestion carries — or two points, with the Distance API. Free.

const metres = await getAddressAu.distance(storeId, suggestion.id, '{your-domain-token}');

Use a domain token, not an API key

Anything in browser JavaScript is readable by anyone who opens the page. A domain token only works from the domains you register, so publishing it costs you nothing. Keep API keys on your server.

Top