AddressFinder

The best way to find exact addresses in New Zealand

  • Skip to Main Navigation
  • Skip to Footer Sitemap
  • Skip to Top

Menu

Get Started Free

  • Pricing
  • Features & plugins
  • About us
  • Case studies
  • FAQ
  • Contact
  • Blog
  • JavaScript widget docs
  • API developer docs
  • Log in
  • Pricing
  • Features
  • More
    • Company & product
      • About Us
      • Case Studies
      • FAQ
      • Partners
      • Blog
      Contact Us
    • Integrations
      • Magento
      • WooCommerce
      • BigCommerce
      • Salesforce
      • Shopify Plus
      See all integrations
    • JavaScript widget docs
      • Integration Guide
      • Widget Code Generator
      • Widget Reference
      • Code Examples
      See all JavaScript docs
    • API developer docs
      • Address Autocomplete
      • Address Metadata
      • Address Verification
      See all API docs
  • Log in
  • Get Started Free

Fixing browser quirks

  • Bypassing AutoFill
  • IE 7/8 compatibility

Bypassing Autofill

Google Chrome and Safari's autofill features are user-controlled settings that web developers have very limited control over. This presents a problem for us with the AddressFinder Widget, since the autofill control will cover the suggestions provided by AddressFinder.

Screenshot of Google Chrome’s Autofill covering the AddressFinder Suggestions

1. Disable on Chrome

To disable the autofill on Chrome you just need to change the autocomplete property to a non standard value such as “disable-autocomplete”

    
      <input
        type="text"
        name="property"
        autocomplete="disable-autocomplete"
      >
    
  

NB: The previous solution of setting autocomplete=“off” no longer works.

2. Disable on Safari

The Safari autofill checks the input label, placeholder, field name and id to determine if the field should be auto-filled. If any of these values contain the word ‘address’ the autofill will be enabled. To disable this on Safari we must remove references to the word ‘address’ in all of these values. Substituting another word for ‘address’, such as ‘property’ will work well. If you must use the word 'Address' in your label or as a placeholder value, you can add extra but non-visible characters into the the word. For example:

The extra characters can’t be seen by the user, but including them tricks the browser into thinking there are no address fields. For example:

    
      <label for="property">Add&zwnj;ress</label>
      <input type="search" name="property" id="property_field" placeholder="Enter your add&zwnj;ress">
    
  

IE 7/8 compatibility

The code block below is constructed from a combination of Widget Code Generator code and supplementary code required for IE 7 & 8.

    
    <script>
      function downloadAF(f){
    var script = document.createElement('script');
    script.src = 'https://api.addressfinder.io/assets/v3/widget.js';
    script.async = true;
    script.onload = f;
    script.onreadystatechange = function() {
      if (script.readyState === 'complete' || script.readyState === 'loaded'){
        f();
      }
    }
    document.body.appendChild(script);
  };

      if (document.addEventListener){
    document.addEventListener('DOMContentLoaded', function(){
      downloadAF(initAF);
    });
  } else {
    document.onreadystatechange = function() {
      if (document.readyState === 'complete' || document.readyState === 'loaded'){
        downloadAF(initAF);
      }
    }
  }

    </script>
    
  

This full code snippet is required to be included if IE 7/8 support is required. If you are not supporting versions of IE < 9 then the simplified version of this code can be used from the widget generator.

  • JavaScript Widget
    • Integration guide
    • Widget code generator
    • Code examples
    • Best practices
    • Fixing browser quirks
    • Advanced usage
    • Can't find your address?
    • JavaScript widget reference
  • API Specs (NZ)
    • Address Autocomplete
    • Address Metadata
    • Address Verification
    • Address Reverse Geocode
    • Address Bounding Box
    • Location Autocomplete
    • Location Metadata
    • Points of Interest Autocomplete
    • Points of Interest Metadata
    • API Errors
  • API Specs (AU)
  • Integrations
    • Magento
    • WooCommerce
    • BigCommerce
    • Salesforce
    • Shopify Plus
    • Spiffy Stores
    • Ruby
    • iOS
    • Drupal
    • Microsoft Dynamics 365
    • Vue
    • Gravity Forms

Sitemap

Home

  • About
  • Contact
  • Blog
  • FAQ
  • Pricing
  • Case Studies
  • Status Page
  • Privacy Policy
  • Terms & Conditions

Features

  • Address Autocomplete
  • Address Verification
  • Address Metadata
  • Geocode Addresses
  • Reverse Geocode Addresses
  • Points of Interest
  • Street, Suburb & City Search
  • Bounding Box Search
  • Customer Portal

Integrations

  • WooCommerce
  • BigCommerce
  • Shopify Plus
  • Magento
  • Salesforce
  • Spiffy Stores
  • iOS
  • Ruby
  • Drupal
  • Microsoft Dynamics 365
  • Vue
  • Gravity Forms

API Documentation

  • Address Autocomplete
  • Address Metadata
  • Address Verification
  • API Errors
  • Another 6 APIs
  • AU APIs specs

Widget Documentation

  • Integration Guide
  • Code Generator
  • Code Examples
  • Javascript Reference

AddressFinder is also available in Australia

AddressFinder provides speedy, accurate and dependable address autocompletion at a fair price. Easily integrate our address finder software with your site to start enjoying our address verification, address autocomplete and other address services today.