External service: Post to web form

The “post to web form” integration enables you to post contact data in real-time to an existing web form. This document provides step-by-step instructions to integrate data collected from your ion experiences with external web forms.

Before We Begin

There are few items you'll need to roundup prior to setting up the integration. These items can be found in your external web form HTML or they may be provided in your vendor's support documentation.

• “Post-To" or endpoint URL
• Web form field names
• Acceptable values for non-text fields

There are a few steps to take in the ion platform before setting up the integration, listed below:  

• Create data collection fields
• Create Ion form(s)
• Set-up testing creative

Let's get started!

1. Create field mapping

Taking the steps below will map your Ion data collection fields to their corresponding external field names. To get started, add your new field mapping:

1. Click the Integrations tab in your ion console’s side nav
2. Click the “New field mapping” button
3. Label the field mapping and optionally add a description
4. From the Integration type menu, select “Post to Web Form”
5. Save

2. Add Outbound fields to field mapping

Outbound fields define the data you extend from Ion to your external web form.

1. Click the “New outbound field” button to add a new field to your field mapping
2. When adding a new field, you will either select from the Data Collection drop-down menus, Core Field drop-down menu, implement a mashup template or add a field via JavaScript
   • To add a form field, use the Data Collection drop-down menus to select the data field category then data collection field
   • OR, to add an ion Core field, select from the Core Field drop-down menu
   • OR, to export multiple ion fields to one external field, use the Mashup Field by plugging {{DataName}} {{DataName2}} , etc. into the editor
   • OR, to reformat a value prior to export, use the JavaScript field to add logic around the value collected in ion. To access data collection fields via Javascript, use respondent.dataname.
3. Optionally make your field required to run the integration
4. Optionally add a default value
5. Enter the external field name
6. Save
7. Repeat these steps for each field that should be included in the Field Mapping

3. Optionally add Inbound fields

Leverage inbound fields to save data from an XML response into Ion data collection. We'll cover how to parse and save JSON responses in a later step.

1. Click the “new inbound field” button
2. Select the Ion data collection field you seek to save the value into
3. Enter an x-path query to parse the value from the XML
4. Save
5. Repeat for each field you seek to save into Ion data collection

4. Create integration

1. Navigate back to Integrations screen
2. Click into the Integrations tab
3. Click the “New integration” button
4. Enter a label
5. Optionally add a description
6. Select the Field Mapping you’ve just created
7. Paste your Form URL into the editor
   • This is the “post to” or end point URL of your web form.
8. Set maximum retries
   • If there is a service interruption with the external platform, Ion will retry the post on the top of the hour for as many retries as you indicate here.
9. Optionally check off special requirements
   • Check “Send form as multipart/form-data” if applicable
   • Check “Disable URL Encoding of all form data” if the data should not be URL encoded or if you are leveraging Javscript Outbound fields to custom encode the data
   • Check “Empty Fields” to exclude external fields that do not have values from the POST data
10. Select POST, GET or PUT as the method
11. Optionally add Debug email address
    • Email addresses specified here will receive an email each time the integration runs that displays the data posted and response received. This is feature typically only used for testing and troubleshooting.
12. Optionally leverage Save Response As
    • Input a data name here if you seek to save the entire response from the external server. This is typically used to save a non-XML response so that a server scriptlet can be used to parse out data points you seek to save into ion data collection.
13. Add Authentication requirements
    • If the integration requires NTLM or Basic authentication, make your selection from the Remote authentication dropdown and select corresponding account credentials
14. Add custom headers
    • If the integration requires custom http headers, enter the name(s) and value(s) here.
15. Save

5. Add integration to Ion pages

The Ion platform runs the integration based on rules you create. Rules can be added to any actionable item in your Ion creative. Integration rules are typically run at the form-level, upon form submission, or on an assessment step. Follow the steps below to add the integration to your ion pages.

1. Navigate into the creative
2. Click on the form, button or link you seek to make the trigger to run your integration
3. In Creative Studio, click on +rules
4. Select the condition that needs to be met to run the integration
   • “No conditions required” is typically used
5. Select “Run integration” as the action
6. Save

6. Test integration

To test your integration, use the testing creative you set up prior to beginning the integration steps. Please note, integrations do not run in Preview Mode so you'll want to open a URL for testing. The integration will run once you submit the Ion form, or complete the action that runs the integration rule. If you’re on the debug email distribution list, you’ll receive an email that displays the data posted and response from the external server. You’ll also want to check that the data you submitted was received by the external platform.
 

Nice work!

Once you’ve completed these steps, your integration is ready for use. You can add the rule to run the integration on all applicable creatives. 

If you have any questions, please contact us at help@rockcontent.com. 😀