Internal labels allows you to use a separate label and value that your end users don't have to see. For instance, lets say you'd like to be able to have an option for a field to add a name that isn’t the label that shows on the live form. This would allow you to easily reference fields in your API setup or webhook send and not affect the experience of the end user.
Setup
Drag and drop the field that you're interested in using onto your form and then select the field to locate your internal label under the general settings on the left. Create a unique field name you can target for data mapping and CSS styling under the internal labels option.
Important note: Internal labels are available on all form fields
(Optional)Webhook Settings
After you've setup the internal label for your Field, you have a few different options to consider for what's next. One of the things we'd like to highlight is how this looks in your webhook settings. To access these settings, you need to navigate to your Form settings page and then select Emails & Actions on the left. At the bottom of this page under Advanced Settings, you'll see the option to add a webhook.
After adding a webhook, you'll see two options related to internal labels under the post data field key option:
-Post with internal field labels
-Post with internal field labels as API-friendly keys
For more information on setting up a webhook, check out this article.
For reference, here's an example of what the exported data would look in a webhook with internal labels vs Form Field IDs:
With internal ID:
FormID=(your formID)&UniqueID=(your Unique ID)&name1234=first+%3D+Jane%0Alast+%3D+Smith&email1234=jane%40email.com&number1234=1234&dropdown-list1234=Option1
With Form field IDs
FormID=(your formID)&UniqueID=(your Unique ID)&173685104=first+%3D+Jane%0Alast+%3D+Smith&173685111=jane%40email.com&173685114=1234&173685122=Option1
Common Questions:
Can I use an internal label with the embed code field?
Yes, you can. Please check out the info below for more information on what this might look like:
getFieldByInternalLabel(internalLabel: string) - internal labels will let you get a field by that value instead of the field's ID (like getField uses).
Example:
const form = window.fsApi().getForm('FORM_ID');
const field = form.getFieldByInternalLabel('my-internal-label');
getFieldBy(predicate: (field) => boolean) - this method allows you to get a field using a predicate function that is passed in. Much like the other method, this will allow users to get fields by something that is not the field's ID. In the example below, we are finding a field based on the field's label:
const form = window.fsApi().getForm('FORM_ID');
const predicate = (field) => field.getGeneralAttribute('label') === 'Field Label';
const field = form.getFieldBy(predicate);
One thing to note about this method is that it will only return the first field that is found via the predicate. Therefore, using the example above, if there were multiple fields that had the label 'Field Label', only the first one would be returned.
For more information on how to Setup APIs and webhooks to program access to third-party applications, we'd recommend checking out our Developers Central page.