---
title: Quick Integration (UI / Forms)
description: "Easy way to add postcode lookup to your HTML address form. Please embed the latest version of the JavaScript class from cdn. *\"We recommend you use our CDN version to ensure you always have the latest functionality and security\"* CDN…"
url: "https://postcodex.io/docs/quick-integration-ui-forms/"
updated: "2020-08-14"
category: Address/Postcode Lookup Guides
---
# Quick Integration (UI / Forms)
Easy way to add postcode lookup to your HTML address form.
Please embed the latest version of the JavaScript class from cdn.
*"We recommend you use our CDN version to ensure you always have the latest functionality and security"*
CDN address: [https://assets.postcodex.io/postcodex-api.min.js](https://assets.postcodex.io/postcodex-api.min.js)
#### Add the js lib
Create/open your HTML file and add the postcodex-api.min.js include from our CDN :
```
```
#### create the html code
Create an address *form*:
```
Postcode:
Company:
Address:
Town:
```
#### wire the form to js class
Instantiate and setup the js class
The following example uses the 'Find Adddress' button onclick to call the lookup action
```
var pcx = new PostcodexApi({
token: "{insert your token here}",
postcodeLookupOptions: {
pcx_output : "postcode_list_display",
pcx_input : "postcode",
pcx_organisationname : "companyname",
pcx_addressline1 : "addressline1",
pcx_addressline2 : "addressline2",
pcx_addressline3 : "addressline3",
pcx_posttown : "town",
selector_type : "id"
}
});
```
The lookup result will be placed into the 'postcode_list_display' element, either the address list or an error message.
#### alternative configurations
The following configuration discards the onclick setting from the 'Find Address' button
This html form use the default ids for each field
```
Postcode:
Company:
Address:
Town:
```
This way the js configuration only needs to set the token, and identify the search button
```
var pcx = new PostcodexApi({
token: "{insert your token here}"
})
pcx.postcodeLookup.wire({
button: "#pc_lookup"
})
// pcx.postcodeLookup("wire", {
// button: "#pc_lookup"
// })
```
#### Full html example
The following code is a full html page that creates a postcode form and wires it to postcodex api.
```
Postcodex Search Example