The Google Analytics Event field can send an event to Google that can be tracked in your analytics account. The field can be configured to send an event when a form is displayed, when a field has its value changed, or when validation errors occur. It cannot be used to send an event when a form's submit button is pressed. For event tracking to work your site must already be using Google Analytics and the standard tracking snippet must be present on the form page.
The event sent to Google will be the default values set in the field. You can trigger this using
The field also supports two custom functions:
sendDefaultEvent(label, value) will send an event to Google Analytics with the category and action specified in the field properties. The value parameter is optional.sendCustomEvent(category, action, label, value) will send an arbitrary event to Google Analytics. The value parameter is optional.
Properties
| Label | Description | Type Name |
|---|---|---|
| GA Category | The Google Analytics event category. A category is the name used to group the things you want to track | CATEGORY |
| GA Action | The Google Analytics event action. Typically the action parameter is used to name the type of event or interaction being tracked in a particular category | ACTION |
| GA Label | The Google Analytics label. Labels are optional | LABEL |
| GA Value | The Google Analytics value. As per Google, values must be integers | VALUE |
| Display Events | Send the event to Google Analytics when the page is displayed | SENDONRENDER |
| Value Events | Send an event to Google Analytics when this field's value is updated. The value of the field can be set with the Helper library setFieldValue() function. If the field has the property "Value Events" set to true, then the act of setting the value will automatically send the event to Google Analytics | SENDONUPDATEVALUE |
| Validation Events | If a field on the form fails its validation, an event will automatically be sent to Google if 'Validation Events' is set to true. This event will supply GA Action of 'Validation Error' rather than the 'GA Action' defined above, and its label will be set as the error message. If the 'Validation Event Values' setting (below) is also set to true, the invalid field's value will be sent as the event's value. Otherwise, no value will be sent | SENDONVALIDATIONERR |
| Validation Event Values | If 'Validation Events' is set to true, then an invalid field's value will be included in a validation error event if this 'Validation Event Values' setting is also set to true. Otherwise, no value will be sent | SENDVALIDATIONVALUE |
| Documentation | Add documentation to your field to help explain any complex functionality to future users. You might include information on what the field does and how it relates to other fields on the form. Notes added here are only ever visible in the Forms Designer, they can be searched for, viewed and downloaded from the action panel. See Common Field Properties for an example | DOCUMENTATION |
Example
This form has a checkbox, a radio group and a single Google Analytics Event field called GAEVENT. When the values of these fields change, an event is sent to Google Analytics.
If you're using Chrome, open the network tab in the browser developer tools to see the events being triggered.
In this screenshot you can see events in Google Analytics. We've already drilled down past the category level so you can see the action and label values.
The Google Analytics Event field has the following default values:
| Property | Value |
|---|---|
| GA Category | Example Forms |
| GA Action | Box Ticking |
| GA Label | The box has been ticked or unticked |
The checkbox has the following handler, which triggers the hidden event field, sending the default values to Google.
function (helper, fieldName, value, valid, eventName) {
if (eventName == 'CHANGE' && valid) {
helper.setFieldValue('GAEVENT','');
}
}
The radio buttons invoke the event field's custom function
This handler has been added to the radio button field:
function(helper, fieldName, value, valid, eventName) {
if (value == 'Yes') {
helper.invokeCustomFieldFn('GAEVENT', 'sendCustomEvent', 'Example Forms', 'Radio Button Change', 'Yes');
} else if (value == 'No') {
helper.invokeCustomFieldFn('GAEVENT', 'sendCustomEvent', 'Example Forms', 'Radio Button Change', 'No');
}
}
Share this page
