postcode-lookup-psl v1.3.5

postcode-lookup-psl

A small library for an easy Postcode address lookup implementation by Paloma staff

Install

NPM

npm i postcode-lookup-psl

CDN

<link rel="stylesheet" href="https://unpkg.com/postcode-lookup-psl/dist/index.min.css">
<script src="https://unpkg.com/postcode-lookup-psl/dist/index.min.js"></script>

Usage

index.html

<input class="txtPostcode" type="text">
<input class="txtAddress1" type="text">
<input class="txtAddress2" type="text">
<input class="txtAddress3" type="text">
<input class="txtTown" type="text">
<input class="txtCounty" type="text">
<select class="ddlCountry">
</select>

index.js

import { postcodeLookup, checkAddressListExists } from 'postcode-lookup-psl'

window.onload = function () {
    postcodeLookupInit();
};


const postcodeLookupInit = async () => {
    const txtPostcode = document.querySelector(".txtPostcode");
    txtPostcode.addEventListener('keyup', async () => {
        // Creates divAddressList if it doesn't already exist
        let divAddressList = checkAddressListExists(txtPostcode);

        divAddressList.appendChild(
            await postcodeLookup({
            postcode: txtPostcode.value.toString(),
            api_key: 'my_api_key',
            provider: 'my_postcode_lookup_provider
            })
        )
    });
}

If any of the fields listed are not found on the page then the value (when selected from the address list) are stored in a cookie so it can still be accessed.

Options

classNames