Decibel Insight
Knowledgebase

Form Tagging

Form tagging simply requires a Decibel ID to be added to each form, and field within that form, that you want to track. An example of this can be seen below.

<form action="submit.php" method="POST" data-di-form-track data-di-form-id="contact">
    First name: <input type="text" name="field156" data-di-field-id="firstname"><br />
    Last name: <input type="text" name="field135" data-di-field-id="lastname"><br />
    <input type="submit" value="Submit">
</form>

If data-di-form-track is present, then the form will be tracked. If data-di-form-id is present, then this is what the form ID will be, if it is not present but data-di-form-track is, we will use the existing mechanism of determining the form ID. data-di-field-id is added to each field, however if this isn’t present, we will use the input’s name attribute.

You can also add data-di-form-track and data-di-form-id to any selector that constitutes a form (such as a div, fieldset, section), however, you will need to use the formSubmitted JavaScript call listed in the Form Submission Tagging article which can be found here.

Tagging Forms Using a Tag Manager

The attributes mentioned above can be hard-coded into a form on a website, or alternatively can be added to forms through a tag management solution. 

The below code is an example of how this can be achieved. You will need to replace [REQUIRED FORMS] with the relevant selector to identify the form in question that you wish to tag, while [FORM NAME] will need to be replaced with the name that you want to give to the form.

Please be aware that this is merely an example and may require amending to work with the forms on your website.

var formTracking = document.querySelectorAll('[REQUIRED FORMS]');
        for (var i = 0; i < formTracking.length; i++) {
            formTracking[i].setAttribute("data-di-form-track", "");
            formTracking[i].setAttribute("data-di-form-id", '[FORM NAME]');
        }

Submission Tagging

If a form on your website uses a non-standard form submission, such as via AJAX, you will need to add a call on the submission of this form to inform Decibel Insight that this has been submitted. You can find out more about Form Submission Tagging here.