Harmony RightAddress JavaScript UI client API

The UI client library acts as a further abstraction wrapper for the Harmony RightAddress JavaScript client. As with the Harmony RightAddress JavaScript client, the objects used by the library are JavaScript representations of those found in the Harmony RightAddress service API.

Constants

Name Type Description
Harmony.UI.LOADING CSS class The CSS class added to the input element during the service method invocation.
Harmony.UI.OUTPUT Field The field used to output any errors that occur during the service method invocation.

Methods

Name Description
Harmony.UI.addField Adds a new field specifying the field name (e.g. Harmony.POSTCODE, Harmony.LOCALITY, etc) and the input element.
Harmony.UI.addressLookup Creates a single-line address lookup on the supplied input element.
Harmony.UI.intlAddressLookup Creates an international single-line address lookup on the supplied input element.
Harmony.UI.buildingNameLookup Creates a building name lookup on the supplied input element.
Harmony.UI.floorLevelTypeSelect Adds the Floor Level types from the specified Source of Truth to the supplied select element.
Harmony.UI.idenfityAddress Identifies the value in the Harmony.EID field and populates any other specified fields with the results.
Harmony.UI.localityLookup Creates a locality lookup on the supplied inputlocality name element.
Harmony.UI.advancedLocalityLookup Creates a locality lookup on the supplied inputelement for any locality level information (name, postcode, state or combined).
Harmony.UI.parseAddress Parses the value retrieved from the Harmony.ADDRESS field and populates any other specified fields with the results.
Harmony.UI.postalLookup Creates a postal address lookup on the supplied input element.
Harmony.UI.postalTypeSelect Adds the Postal types from the specified Source of Truth to the supplied select element.
Harmony.UI.postcodeLookup Creates a postcode lookup on the supplied input element.
Harmony.UI.setOutputElement Sets the element to use to display the Harmony UI output.
Harmony.UI.streetLookup Creates a street lookup on the supplied input element.
Harmony.UI.streetNumberLookup Creates a street number lookup on the supplied input element.
Harmony.UI.streetSuffixTypeSelect Adds the Street Suffix types from the specified Source of Truth to the supplied select element.
Harmony.UI.streetTypeSelect Adds the Street types from the specified Source of Truth to the supplied select element.
Harmony.UI.subdwellingLookup Creates a subdwelling lookup on the supplied input element.
Harmony.UI.suburbLookup Creates a suburb lookup on the supplied input element.
Harmony.UI.townCityLookup Creates a town/city lookup on the supplied input element.
Harmony.UI.unitFlatTypeSelect Adds the Unit/Flat types from the specified Source of Truth to the supplied select element.

Harmony.UI.addField(field, element, index)

Adds a new field specifying the field name (e.g. Harmony.POSTCODE, Harmony.LOCALITY, etc) and the input element.

field

Type: String The name of the field to be added (e.g. Harmony.POSTCODE).

element

Type: Object The input element to be assigned to the field (e.g. document.getElementById("postcodeField")).

index

Type: Integer The optional index if there are multiple sets of lookups on the same page (e.g. one for residential addresses and the other one for postal addresses). Currently only available for addressLookup.

The following example assigns the Harmony.LOCALITY field to the input element with the ID localityField:


    // Perform the assignment using standard JavaScript.
    Harmony.UI.addField(Harmony.LOCALITY, document.getElementById("localityField"));
  
    // Perform the assignment using a jQuery selector.
    Harmony.UI.addField(Harmony.LOCALITY, $("#localityField"));
    
    /* Perform the assignment using a jQuery selector with index 
       for the second set address lookup. */
    Harmony.UI.addField(Harmony.LOCALITY, $("#localityField"), 1); 
    

Harmony.UI.addressLookup(element, sourceOfTruth, opts, stateElement, index)

Creates a single-line address lookup on the supplied input element.

element

Type: Object The input element to create the lookup for (e.g. document.getElementById("address")).

sourceOfTruth

Type: String The Source of Truth to be used for the lookup (e.g. Harmony.AUPAF).

opts

Type: Object Optional parameter to be passed into the jQuery UI Autocomplete component (e.g. autoFocus)

stateElement

Type: Object Optional parameter to be supplied to retrieve the state value. If opts is undefined, only addresses with this state will be in the results. Otherwise it will return all addresses and addresses with this state will be prioritized in the results.

index

Type: String Optional index to indicate which set of fields to populate if there are multiple lookups.

The following example creates an AUPAF single-line address lookup on the input element with ID singleLineAddress:


    // Perform the assignment using standard JavaScript.
    Harmony.UI.addressLookup(
            document.getElementById("singleLineAddress"), Harmony.AUPAF);
    
    // Perform the assignment using a jQuery selector.
    Harmony.UI.addressLookup($("#singleLineAddress"), Harmony.AUPAF);
    
    /* Perform the assignment using a jQuery selector and specify that the lookup
       should autofocus. */
    Harmony.UI.addressLookup($("#singleLineAddress"), Harmony.AUPAF, 
            { autoFocus: true });
    
    /* Perform the assignment using standard JavaScript for addresses 
       restricted to the state value in the state element. */
    Harmony.UI.addressLookup(
            document.getElementById("singleLineAddress"), Harmony.AUPAF, 
            undefined, document.getElementById("state"));
            
    // Perform the assignment using a jQuery selector with index for the second set lookup.
    Harmony.UI.addressLookup($("#singleLineAddress"), Harmony.AUPAF, opt, null, 1);
            

Harmony.UI.intlAddressLookup(element, countryElment, opts, index)

Creates an international single-line address lookup on the supplied input element.

element

Type: Object The input element to create the lookup for (e.g. document.getElementById("address")).

countryElment

Type: Object The country code to create the lookup for (e.g. document.getElementById("country")).

opts

Type: Object Optional parameter to be passed into the jQuery UI Autocomplete component (e.g. autoFocus)

index

Type: String Optional index to indicate which set of fields to populate if there are multiple lookups.

The following example creates an international single-line address lookup on the input element with ID address and input countryElment with ID country:


    // Perform the assignment using standard JavaScript.
    Harmony.UI.intlAddressLookup(
            document.getElementById("address"), document.getElementById("country"));
    
    // Perform the assignment using a jQuery selector.
    Harmony.UI.addressLookup($("#address"), $("#country"));
    
    /* Perform the assignment using a jQuery selector and specify that the lookup
       should autofocus. */
    Harmony.UI.addressLookup($("#address"), $("#country"), { autoFocus: true });
            
    // Perform the assignment using a jQuery selector with index for the second set lookup.
    Harmony.UI.addressLookup($("#address"), $("#country"), opt, 1);
            

Harmony.UI.buildingNameLookup(element, sourceOfTruth, opts)

Creates a building name on the supplied input element.

element

Type: Object The input element to create the lookup for (e.g. document.getElementById("buildingName")).

sourceOfTruth

Type: String The Source of Truth to be used for the lookup (e.g. Harmony.AUPAF).

opts

Type: Object Optional parameters to be passed into the jQuery UI Autocomplete component (e.g. autoFocus)

The following example creates an AUPAF building name lookup on the input element with ID building:


    // Perform the assignment using standard JavaScript.
    Harmony.UI.buildingNameLookup(
            document.getElementById("building"), Harmony.AUPAF);
    
    // Perform the assignment using a jQuery selector.
    Harmony.UI.buildingNameLookup($("#building"), Harmony.AUPAF);
    
    /* Perform the assignment using a jQuery selector and specify that the lookup
       should autofocus. */
    Harmony.UI.buildingNameLookup($("#building"), Harmony.AUPAF, { autoFocus: true });
     

Harmony.UI.floorLevelTypeSelect(element, sourceOfTruth)

Adds the Floor Level types from the specified Source of Truth to the supplied select element.

element

Type: Object The select element to create the lookup for (e.g. document.getElementById("floorLevelTypes")).

sourceOfTruth

Type: String The Source of Truth to be used for the lookup (e.g. Harmony.AUPAF).

The following example adds the floor level types to the select element with the ID floorLevelTypes:


    // Perform the assignment using standard JavaScript.
    Harmony.UI.floorLevelTypeSelect(document.getElementById("floorLevelTypes"), 
            Harmony.AUPAF);
  
    // Perform the assignment using a jQuery selector.
    Harmony.UI.floorLevelTypeSelect($("#floorLevelTypes"), Harmony.AUPAF);
    

Harmony.UI.identifyAddress()

Identifies the value in the Harmony.EID field and populates any other specified fields with the results.

The following example uses jQuery to assign a click event to a button with the ID identifyButton, which then identifies the address using the eid input and outputs the resolved address components into the postcode, locality, street, streetNumber and subdwelling inputs:


    // Add the eid field using jQuery selectors.
    Harmony.addField($("#eid"), Harmony.EID);
    
    // Add the output fields using jQuery selectors.
    Harmony.addField($("#postcode"), Harmony.POSTCODE);
    Harmony.addField($("#locality"), Harmony.LOCALITY);
    Harmony.addField($("#street"), Harmony.STREET);
    Harmony.addField($("#streetNumber"), Harmony.STREET_NUMBER);
    Harmony.addField($("#subdwelling"), Harmony.SUBDWELLING);
    
    // Use jQuery to generate the click event for the button.
    $("#identifyButton").click(function(event) {
        // Identify the address using the Encrypted ID.
        Harmony.UI.identifyAddress();
    });
     

Harmony.UI.localityLookup(element, sourceOfTruth, opts)

Creates a locality on the supplied input locality name element.

element

Type: Object The input element to create the lookup for (e.g. document.getElementById("locality")).

sourceOfTruth

Type: String The Source of Truth to be used for the lookup (e.g. Harmony.AUPAF).

opts

Type: Object Optional parameters to be passed into the jQuery UI Autocomplete component (e.g. autoFocus)

The following example creates an AUPAF locality lookup on the input element with ID locality:


    // Perform the assignment using standard JavaScript.
    Harmony.UI.localityLookup(
            document.getElementById("locality"), Harmony.AUPAF);
    
    // Perform the assignment using a jQuery selector.
    Harmony.UI.localityLookup($("#locality"), Harmony.AUPAF);
    
    /* Perform the assignment using a jQuery selector and specify that the lookup
       should autofocus. */
    Harmony.UI.localityLookup($("#locality"), Harmony.AUPAF, { autoFocus: true });
     

Harmony.UI.advancedLocalityLookup(element, sourceOfTruth, opts)

Creates a locality on the supplied inputelement for any locality level information (name, postcode, state or combined).

element

Type: Object The input element to create the lookup for (e.g. document.getElementById("locality")).

sourceOfTruth

Type: String The Source of Truth to be used for the lookup (e.g. Harmony.AUPAF).

opts

Type: Object Optional parameters to be passed into the jQuery UI Autocomplete component (e.g. autoFocus)

The following example creates an AUPAF locality lookup on the input element with ID locality:


    // Perform the assignment using standard JavaScript.
    Harmony.UI.advancedLocalityLookup(
            document.getElementById("locality"), Harmony.AUPAF);
    
    // Perform the assignment using a jQuery selector.
    Harmony.UI.advancedLocalityLookup($("#locality"), Harmony.AUPAF);
    
    /* Perform the assignment using a jQuery selector and specify that the lookup
       should autofocus. */
    Harmony.UI.advancedLocalityLookup($("#locality"), Harmony.AUPAF, { autoFocus: true });
     

Harmony.UI.parseAddress()

Parses the value entered in the Harmony.ADDRESS field and populates any other specified fields with the parse results.

The following example uses jQuery to assign a click event to a button with the ID parseButton, which then parses the value in the address input and outputs the generated address components into the postcode, locality and street inputs:


    // Add the address field using jQuery selectors.
    Harmony.addField($("#address"), Harmony.ADDRESS);
    
    // Add the output fields using jQuery selectors.
    Harmony.addField($("#postcode"), Harmony.POSTCODE);
    Harmony.addField($("#locality"), Harmony.LOCALITY);
    Harmony.addField($("#street"), Harmony.STREET);
    
    // Use jQuery to generate the click event for the button.
    $("#parseButton").click(function(event) {
        // Perform the parse.
        Harmony.UI.parseAddress();
    });
     

Harmony.UI.postalLookup(element, sourceOfTruth, opts)

Creates a postal on the supplied input element.

element

Type: Object The input element to create the lookup for (e.g. document.getElementById("postal")).

sourceOfTruth

Type: String The Source of Truth to be used for the lookup (e.g. Harmony.AUPAF).

opts

Type: Object Optional parameters to be passed into the jQuery UI Autocomplete component (e.g. autoFocus)

The following example creates an AUPAF postal lookup on the input element with ID postalAddress:


    // Perform the assignment using standard JavaScript.
    Harmony.UI.postalLookup(
            document.getElementById("postalAddress"), Harmony.AUPAF);
    
    // Perform the assignment using a jQuery selector.
    Harmony.UI.postalLookup($("#postalAddress"), Harmony.AUPAF);
    
    /* Perform the assignment using a jQuery selector and specify that the lookup
       should autofocus. */
    Harmony.UI.postalLookup($("#postalAddress"), Harmony.AUPAF, { autoFocus: true });
     

Harmony.UI.postalTypeSelect(element, sourceOfTruth)

Adds the Postal types from the specified Source of Truth to the supplied select element.

element

Type: Object The select element to create the lookup for (e.g. document.getElementById("postalTypes")).

sourceOfTruth

Type: String The Source of Truth to be used for the lookup (e.g. Harmony.AUPAF).

The following example adds the postal types to the select element with the ID postalTypes:


    // Perform the assignment using standard JavaScript.
    Harmony.UI.postalTypeSelect(document.getElementById("postalTypes"), 
            Harmony.AUPAF);
  
    // Perform the assignment using a jQuery selector.
    Harmony.UI.postalTypeSelect($("#postalTypes"), Harmony.AUPAF);
    

Harmony.UI.postcodeLookup(element, sourceOfTruth, opts)

Creates a postcode lookup on the supplied input element.

element

Type: Object The input element to create the lookup for (e.g. document.getElementById("postcode")).

sourceOfTruth

Type: String The Source of Truth to be used for the lookup (e.g. Harmony.AUPAF).

opts

Type: Object Optional parameters to be passed into the jQuery UI Autocomplete component (e.g. autoFocus)

The following example creates an AUPAF postcode lookup on the input element with ID postalCode:


    // Perform the assignment using standard JavaScript.
    Harmony.UI.postcodeLookup(
            document.getElementById("postalCode"), Harmony.AUPAF);
    
    // Perform the assignment using a jQuery selector.
    Harmony.UI.postcodeLookup($("#postalCode"), Harmony.AUPAF);
    
    /* Perform the assignment using a jQuery selector and specify that the lookup
       should autofocus. */
    Harmony.UI.postcodeLookup($("#postalCode"), Harmony.AUPAF, { autoFocus: true });
     

Harmony.UI.setOutputElement(element)

Sets the element to use to display the Harmony UI output.

element

Type: Object The element (can be any type) in which to post the Harmony UI output (e.g. document.getElementById("output")).

The following example sets the output element to the element with the ID outputDiv:


    // Perform the assignment using standard JavaScript.
    Harmony.UI.setOutputElement(document.getElementById("outputDiv"));
  
    // Perform the assignment using a jQuery selector.
    Harmony.UI.setOutputElement($("#outputDiv"));
    

Harmony.UI.streetLookup(element, sourceOfTruth, opts)

Creates a street lookup on the supplied input element.

element

Type: Object The input element to create the lookup for (e.g. document.getElementById("street")).

sourceOfTruth

Type: String The Source of Truth to be used for the lookup (e.g. Harmony.AUPAF).

opts

Type: Object Optional parameters to be passed into the jQuery UI Autocomplete component (e.g. autoFocus)

The following example creates an AUPAF street lookup on the input element with ID street:


    // Perform the assignment using standard JavaScript.
    Harmony.UI.streetLookup(
            document.getElementById("street"), Harmony.AUPAF);
    
    // Perform the assignment using a jQuery selector.
    Harmony.UI.streetLookup($("#street"), Harmony.AUPAF);
    
    /* Perform the assignment using a jQuery selector and specify that the lookup
       should autofocus. */
    Harmony.UI.streetLookup($("#street"), Harmony.AUPAF, { autoFocus: true });
     

Harmony.UI.streetNumberLookup(element, sourceOfTruth, opts)

Creates a street number lookup on the supplied input element.

element

Type: Object The input element to create the lookup for (e.g. document.getElementById("streetNumber")).

sourceOfTruth

Type: String The Source of Truth to be used for the lookup (e.g. Harmony.AUPAF).

opts

Type: Object Optional parameters to be passed into the jQuery UI Autocomplete component (e.g. autoFocus)

The following example creates an AUPAF street number lookup on the input element with ID streetNumber:


    // Perform the assignment using standard JavaScript.
    Harmony.UI.streetNumberLookup(
            document.getElementById("streetNumber"), Harmony.AUPAF);
    
    // Perform the assignment using a jQuery selector.
    Harmony.UI.streetNumberLookup($("#streetNumber"), Harmony.AUPAF);
    
    /* Perform the assignment using a jQuery selector and specify that the lookup
       should autofocus. */
    Harmony.UI.streetNumberLookup($("#streetNumber"), Harmony.AUPAF, 
            { autoFocus: true });
     

Harmony.UI.streetSuffixTypeSelect(element, sourceOfTruth)

Adds the Street Suffix types from the specified Source of Truth to the supplied select element.

element

Type: Object The select element to create the lookup for (e.g. document.getElementById("streetSuffixTypes")).

sourceOfTruth

Type: String The Source of Truth to be used for the lookup (e.g. Harmony.AUPAF).

The following example adds the street suffix types to the select element with the ID streetSuffixTypes:


    // Perform the assignment using standard JavaScript.
    Harmony.UI.streetSuffixTypeSelect(document.getElementById("streetSuffixTypes"), 
            Harmony.AUPAF);
  
    // Perform the assignment using a jQuery selector.
    Harmony.UI.streetSuffixTypeSelect($("#streetSuffixTypes"), Harmony.AUPAF);
    

Harmony.UI.streetTypeSelect(element, sourceOfTruth)

Adds the Street types from the specified Source of Truth to the supplied select element.

element

Type: Object The select element to create the lookup for (e.g. document.getElementById("streetTypes")).

sourceOfTruth

Type: String The Source of Truth to be used for the lookup (e.g. Harmony.AUPAF).

The following example adds the street suffix types to the select element with the ID streetTypes:


    // Perform the assignment using standard JavaScript.
    Harmony.UI.streetTypeSelect(document.getElementById("streetTypes"), 
            Harmony.AUPAF);
  
    // Perform the assignment using a jQuery selector.
    Harmony.UI.streetTypeSelect($("#streetTypes"), Harmony.AUPAF);
    

Harmony.UI.subdwellingLookup(element, sourceOfTruth, opts)

Creates a Subdwelling lookup on the supplied input element.

element

Type: Object The input element to create the lookup for (e.g. document.getElementById("subdwelling")).

sourceOfTruth

Type: String The Source of Truth to be used for the lookup (e.g. Harmony.AUPAF).

opts

Type: Object Optional parameters to be passed into the jQuery UI Autocomplete component (e.g. autoFocus)

The following example creates an AUPAF subdwelling lookup on the input element with ID subdwelling:


    // Perform the assignment using standard JavaScript.
    Harmony.UI.subdwellingLookup(
            document.getElementById("subdwelling"), Harmony.AUPAF);
    
    // Perform the assignment using a jQuery selector.
    Harmony.UI.subdwellingLookup($("#subdwelling"), Harmony.AUPAF);
    
    /* Perform the assignment using a jQuery selector and specify that the lookup
       should autofocus. */
    Harmony.UI.subdwellingLookup($("#subdwelling"), Harmony.AUPAF, 
            { autoFocus: true });
     

Harmony.UI.suburbLookup(element, sourceOfTruth, opts)

Creates a Suburb lookup on the supplied input element.

element

Type: Object The input element to create the lookup for (e.g. document.getElementById("suburb")).

sourceOfTruth

Type: String The Source of Truth to be used for the lookup (e.g. Harmony.AUPAF).

opts

Type: Object Optional parameters to be passed into the jQuery UI Autocomplete component (e.g. autoFocus)

The following example creates an AUPAF suburb lookup on the input element with ID suburb:


    // Perform the assignment using standard JavaScript.
    Harmony.UI.suburbLookup(
            document.getElementById("suburb"), Harmony.AUPAF);
    
    // Perform the assignment using a jQuery selector.
    Harmony.UI.suburbLookup($("#suburb"), Harmony.AUPAF);
    
    /* Perform the assignment using a jQuery selector and specify that the lookup
       should autofocus. */
    Harmony.UI.suburbLookup($("#suburb"), Harmony.AUPAF, 
            { autoFocus: true });
     

Harmony.UI.townCityLookup(element, sourceOfTruth, opts)

Creates a Town/City lookup on the supplied input element.

element

Type: Object The input element to create the lookup for (e.g. document.getElementById("townCity")).

sourceOfTruth

Type: String The Source of Truth to be used for the lookup (e.g. Harmony.AUPAF).

opts

Type: Object Optional parameters to be passed into the jQuery UI Autocomplete component (e.g. autoFocus)

The following example creates an AUPAF town/city lookup on the input element with ID townOrCity:


    // Perform the assignment using standard JavaScript.
    Harmony.UI.townCityLookup(
            document.getElementById("townOrCity"), Harmony.AUPAF);
    
    // Perform the assignment using a jQuery selector.
    Harmony.UI.townCityLookup($("#townOrCity"), Harmony.AUPAF);
    
    /* Perform the assignment using a jQuery selector and specify that the lookup
       should autofocus. */
    Harmony.UI.townCityLookup($("#townOrCity"), Harmony.AUPAF, 
            { autoFocus: true });
     

Harmony.UI.unitFlatTypeSelect(element, sourceOfTruth)

Adds the Unit/Flat types from the specified Source of Truth to the supplied select element.

element

Type: Object The select element to create the lookup for (e.g. document.getElementById("unitFlatTypes")).

sourceOfTruth

Type: String The Source of Truth to be used for the lookup (e.g. Harmony.AUPAF).

The following example adds the unit/flat types to the select element with the ID unitTypes:


    // Perform the assignment using standard JavaScript.
    Harmony.UI.unitFlatTypeSelect(document.getElementById("unitTypes"), 
            Harmony.AUPAF);
  
    // Perform the assignment using a jQuery selector.
    Harmony.UI.unitFlatTypeSelect($("#unitTypes"), Harmony.AUPAF);