Skip to main content

Formstack Integration

Screenshots

Address Finder

Ideal Postcodes Formstack Integration

Installation

This installation works ny inserting javascript into the Formstack Form builder

info

If you need support, you can either reach out to us on our support page or drop by our developer chat page.

Create Address Field

Formstack comes with a pre-built address form. Inside the Basic Field menu, simply drag it over to the form builder on the left

Formstack Integration Address Form

Initialise Address Finder

Under the Advanced Field menu, drag Embed Code over to the form builder on the left.

Formstack Integration Address Form

Click on the embed code field and paste the javascript below:

Formstack Integration Address Form

<script src="https://cdn.jsdelivr.net/npm/@ideal-postcodes/address-finder-bundled@3"></script>

<script>
IdealPostcodes.AddressFinder.setup({
apiKey: "ak_test",
outputFields: {
line_1: 'input[aria-label="Address Line 1"]',
line_2: 'input[aria-label="Address Line 2"]',
post_town: 'input[aria-label="City"]',
postcode: 'input[aria-label="Postcode"]',
},
});
</script>

Make sure you update the value for the apiKey with your own API Key. Your API Key typically begins with ak_.

Optional: Customise the Address Finder Script

If you wish to add an additional field, include the parameter name from our documentation. For instance, adding a county field to your script will look like:

outputFields: {
line_1: 'input[aria-label="Address Line 1"]',
line_2: 'input[aria-label="Address Line 2"]',
post_town: 'input[aria-label="City"]',
postcode: 'input[aria-label="Postcode"]',
county: 'input[aria-label="County"]',
}