How to Use Hidden Fields in Vine Forms
This can be easily achieved with Vine forms and here is some guidance how to do this step by step:
- Create a simple Vine contact form that will
- identify the visitor or ask for email if the visitor is anonymous
Step 1. Creating Vine form
Create a contact Vine form which will identify the site visitor and ask for email (and, possibly, other contact data) if the visitor is anonymous. Add a field which will be hidden and where you will enter your custom data to be later sent to the visitor.
In the following sample form, the Event Description field is used as a hidden one. (If, for example, number values are needed then any of the person custom number fields can be used.)
(Do not forget to clear the Mandatory flag from the hidden field as this will prevent the form from submitting.)
To hide the Event Description field, you can use the following CSS:
- New forms
var shadowParent = document.querySelector(".VineForm");
- Old forms not using Shadow DOM:
It is recommended to preview your form for the identified and anonymous users:
Step 2 . Creating Email
Create an email where you can insert data from the hidden form field using the [[FORM.FIELD]] syntax.
For example, if you are using the Event Description field to store your data then you can insert the data in email using the [[FORM.EVENT_DESCRIPTION]] tag:
Step 3. Creating Automation Rule
Create an automation that will trigger when your site visitor submits the form and then will send the email with the data from the hidden field:
When creating, the Form Submitted trigger please select the form you created in step 1.
When creating the Send Email action you need to select the email you created in step 2:
Enable the automation rule and verify its settings. Consider carefully what you need to select from the How many automations to run setting. For automations started by a form submit, you normally should select All started: