Code examples

In this page

Address widget for Javascript libraries

Make use of a variety of popular libraries to integrate Addressfinder into your form/page.

Custom address widget examples

1. Capturing Address metadata such as GPS coordinates, LGA, Meshblock and SA1. - Demonstrates how to collect GPS coordinates, LGA name and type, meshblock IDs and SA1 data.

   #Metadata

2. Multiple country address form - The code demonstrates the searching of an address from either AU or NZ. It then the populates the address info into the address fields. The country select box is used to determine which address database is searched.

   #Multiple Countries #Multiple Widgets

3. Autocomplete Address and Suburb-State-Postcode combination - Demonstrates configuring an autocomplete widget on the address field, as well as on the suburb field. This means that if a user is unable/unwilling to select their address for some reason, then they can still use the location autocomplete, ensuring they have a valid suburb/state/postcode combination.

   #Location #Postcode #State #Suburb

4. Custom styling: Fixed width adjustment - The example of the Addressfinder widget has the manual styling feature turned on. This enables the styling to be set by the customer rather than using the default style. When you make a search, you will notice the font and colour has been changed to match the style of the page.

   #Custom #Styling

5. Smart Billing and Shipping Checkout Form - The example shows how Addressfinder can be used in a smart way within an address collecting form. By toggling the 'Ship to my billing address' button a user can specify a separate shipping address (no PO Box type addresses) to their billing address (address delivered to by Australia Post).

   #Multiple Widgets #PO Box #Shipping

6. Restriction by Geofence - The code produces a pop-up which notifies the user whether or not they are in the designated location. The location boundary is defined using a polygon.

   #GPS #Geofence #Logic #Metadata

7. International Address Autocomplete - Demonstrates how to use the widget to search for addresses within 15 different countries.

   #International #Multiple Countries

8. Multiple widgets on one page - The example shows how it's possible to use two widgets to collect two different types of addresses within the same page. We are using a billing and shipping address form as an example.

   #Australia Post #Multiple Widgets #PO Box

9. Scrolling panel example - Displays the widget popup in a user-defined container, rather than at the bottom of the document body.

   #DOM #User Interface

10. Open Street Maps Address Geocoding with SA1 - The example shows how you can capture Addressfinder data and populate it on Open Street Maps while also obtaining SA1 metadata. It functions for both AU and NZ.

    #GPS #Maps #Multiple Countries #Multiple Widgets #Open Street Map

11. Geofence example with custom polygons - The example shows how you can use polygons to determine whether an address is in a particular area. In this example we use Australia's Mainland and Tasmania as the two "areas".

    #GPS #Geofence #Restrict

12. Form without address line 2 - The example shows the basic use case of the AddressFinder widget but on a form that has fewer address fields. This form only has one "address line" so the widget has been modified to combine the 'Address_Line_1' and 'Address_Line_2' elements when populating the content into the appropriate field.

    #DOM #Logic #Split Fields #Street

Custom Email widget examples

1. Allow all emails - With this, you will not block any email from being submitted, but you will have the ability to ask your customers to add a better email address if possible. The message is optional and a nicely worded default will be provided if omitted.

   #Email

2. Strict blocking - With this, you will block all addresses apart from valid, corporate email addresses.

   #Email

3. Verify email and address autocomplete (AU) - This form demonstrates the verification of an email field, as well as the address autocomplete widget being used on the same form.

   #Email #Multiple Widgets #Split Fields

Other code examples