Custom Data Attributes (and Validation Error Tracking
Data attributes attach your own labeled metadata to form elements - like data-form-name="auto-quote" . They're the standard way to give GTM and analytics clean hooks. A data attribute is a name and a value (data-<name>="<value>" ), and you can add many per element.
How to add them
Open an element's "IDs, Classes, & Data Attributes" section → Data Attributes → + Add attribute.
The data- prefix is added for you.
Type name component-action , value submit → data-component-action="submit" .
Works on fields, options, step, headline, sub-headline, buttons, progress bar, landing elements, and the whole form.
Form-wide attributes
Settings tab → Form Data Attributes (near the top, under Basic Settings).
Applies to the whole form on every step.
Where they render
On the element's wrapper (and on the form container + <form> for form-wide).
Naming examples
You choose names/values:
| Attribute | Purpose |
|---|---|
data-form-name="auto-quote" |
Stable name for the whole form, so events attribute to which form fired them. |
data-component-action="submit" |
Labels what a component does. |
data-visibility="true" |
A flag, e.g. for a GTM Element-Visibility trigger. |
Reserved names
A few platform-internal names are blocked (the editor warns): data-field , data-bg , data-funnel-id , data-element-id , data-error-for , and anything starting with data-lc- .
Dynamic value - last-updated timestamp
In the Form Data Attributes set, type {{last_updated}} as a value and it resolves at page-load to the funnel's last-edit timestamp (ISO).
e.g. data-last-updated = {{last_updated}} shows which version was live.
It updates on edit+save, not on traffic.
This is the only auto-fill token for data-attribute values. For richer live data (Anura result, session ID, A/B variant, cookies), use a Dynamic Hidden Field (article 3).
Validation Error Tracking (automatic)
Every field's validation error text carries hooks - no setup.
When an error appears, the message element has: class lc-field-error-text , id lc-error-<fieldId> , role="alert" , data-error-for (field ID), data-error-field-name (field label), data-error-message (the text).
To fire an event when an error appears
In GTM: create an Element Visibility trigger on .lc-field-error-text ; read the message from the element text or data-error-message ; segment by data-error-for / data-error-field-name .
Multiple simultaneous errors each get their own element, so each is independently trackable.
A/B identifiers (automatic)
Forms in a running A/B test auto-carry data-lc-* attributes (data-lc-variant , data-lc-variant-name , etc.) - see article 3.
Reading attributes
GTM DOM/click/visibility triggers; JS document.querySelector('[data-form-name="auto-quote"]') or element.dataset.formName ; CSS [data-visibility="true"] { ... } .