Enabling Address Search Using Address Services

Estimated Reading Time:  6 minutes

Overview

Address Services enables address-location searching using the Address Search component. End-users End-Users are the individuals accessing an application through Express View. In most cases, end-users are the customers using the product. enter a location's address, and results narrow as they type. Sometimes, your end-users may know the name of the location, but not the address. Address Services let your end-users look up a location instead. These services also let them search for the name of a business, building, or landmark.

The benefits of using the address service for the Address Search component include:

NOTE  When setting up a new service, it is the customer/creator's responsibility to obtain an API key for the Google Places or Canada Post services. API Keys are owned by the customer and should not be exposed to end-users.

What You’ll Learn

In this article, we'll cover how to set up each of the address services for address look-up with the Address Search component.

Setting Up a Google Places Service in Service Administration

The first step in using Google Places address look-up is adding the Google Place Details API service. You'll do this in Services Administration. You must have a Google Places API key to set up a Google Place Details Service.

NOTE   

TIP  To learn more about getting a Google Places API key, visit the following link: https://developers.google.com/places/web-service/get-api-key.

1. At the top right of the Unqork Designer Platform, click the Settings ▾ drop-down.
2. Click Administration.

A static image displaying the Create New Service modal, the Service Title and Service Name fields are highlighted.

3. Under Integration, select Services Administration to open the Services Administration page.
4. Click + Add a Service.
5. In the Service Title field, enter {teamName} - Google Places. Replace {teamName} with your initials or the name of your application team. For example: Sales - Google Places.
6. In the Service Name field, enter {teamName}-google-places.

NOTE  Use lowercase alphanumeric characters along with a hyphen (-). A Service Name cannot not start or end with a hyphen. There cannot be consecutive hyphens in a Service Name.

7. Click Create. The service's information page displays.
8. Click Edit Icon Edit.
9. Click Service Type.
10. From the Authentication method drop-down, select Google Places.
11. Enter the Google Places API key.

A static image displaying the Service Info page of a newly created Google Places service. The Authentication method drop down and API Key fields are highlighted.

12. Click Save Changes. The Services Administration page loads, displaying the new service at the top of the list.

Configuring an Address Search Component to Use the Google Place Details Service

Configure an Address Search component to use the Google Place Details service. These instructions assume that you have an open module saved with a title.

1. Drag and drop an Address Search iconAddress Search component onto your canvas.
2. In the Property ID A Property ID is the unique field ID used by Unqork to track and link components in your module. field, enter address.
3. In the Label Text Label Text conveys what the input component is and what information it displays. Enter the purpose of the corresponding component or field. field, enter Enter Your Address:.
4. Check any of the Show Street, Show Street 2, Show City, Show State, Show Zip, and Show Country checkboxes as desired. Checked fields display in Express View and populate with the data returned by the Google Places API.

NOTE  All location data returned by the Google Places API stores in the submission data, even if you don't check the respective checkbox.

A static image displaying the Address Search configuration page, the Property ID, Label, and Address Display Settings are highlighted.

5. From the component's configuration window, select the Data Icon Data tab.
6. From the Select API drop-down, select the Address Service created in the previous section. In this case, Sales - Google Places. This connects your Address Search component to the Google Places service you added in Services Administration.

NOTE  If only one Address Service exists, then it is selected by default.

A static image displaying the Address Search configuration window. The Data section is displayed and the Sales - Google Places Address Service is highlighted.

7. Click Save & Close.
8. Save your module.

You're now ready to use Google Places-enabled address search.

Setting Up a Canada Post Service in Service Administration

The first step in using the Canada Post address look-up is adding the Canada Post service. You'll do this in Services Administration. You must have a Canada Post API key to set up a Canada Post Service.

TIP  To learn more about getting a Canada Post API key, visit the following link: https://www.canadapost-postescanada.ca/ac/support/setup-guides/#create-an-api-key.

1. At the top right of the Unqork Designer Platform, click the Settings ▾ drop-down.
2. Click Administration.

A static image displaying the Create New Service modal, the Service Title and Service Name fields are highlighted.

3. Under Integration, select Services Administration to open the Services Administration page.
4. Click + Add a Service.
5. In the Service Title field, enter {teamName} - Canada Post. Replace {teamName} with your initials or the name of your application team. For example: Sales - Canada Post.
6. In the Service Name field, enter {teamName}-canada-post.

NOTE  Use lowercase alphanumeric characters along with a hyphen (-). A Service Name cannot start or end with a hyphen. There cannot be consecutive hyphens in a Service Name.

7. Click Create. The service's information page displays.
8. Click Edit Icon Edit.
9. Click Service Type.
10. From the Authentication method drop-down, select Canada Post.
11. Enter the Canada Post API key.

A static image displaying the Service Info page of a newly created Google Places service. The Authentication method drop down and API Key fields are highlighted.

12. Click Save Changes. The Services Administration page loads, displaying the new service at the top of the list.

Configuring an Address Search Component to Use the Canada Post Service

Configure an Address Search component to use the Canada Post service. These instructions assume that you have an open module saved with a title.

1. Drag and drop an Address Search iconAddress Search component onto your canvas.
2. In the Property ID A Property ID is the unique field ID used by Unqork to track and link components in your module. field, enter address.
3. In the Label Text Label Text conveys what the input component is and what information it displays. Enter the purpose of the corresponding component or field. field, enter Enter Your Address:.
4. Check any of the Show Street, Show Street 2, Show City, Show State, Show Zip, and Show Country checkboxes as desired. Checked fields display in Express View and populate with the data returned by the Canada Post API.

NOTE  All location data returned by the Canada Post API stores in the submission data, even if you don't check the respective checkbox.

A static image displaying the Address Search configuration page, the Property ID, Label, and Address Display Settings are highlighted.

5. From the component's configuration window, select the Data Icon Data tab.
6. From the Place Service options, select Canada Post.
7. From the Select API drop-down, select the Address Service created in the previous section. In this case, Sales - Canada Post. This connects your Address Search component to the Google Places service you added in Services Administration.

NOTE  If only one Address Service exists, then it is selected by default.

A static image displaying the Address Search configuration window. The Data section is displayed and the Sales - Canada Post Address Service is highlighted.

8. Click Save & Close.
9. Save your module.

You're now ready to use Canada Post-enabled address search.

Best Practices

Resources