Jotform

Jotform is a popular online form builder that makes it easy to create professional forms without coding. It supports conditional logic, payment integrations, file uploads, and hundreds of templates.

Jotform forms are typically embedded as cross-origin iframes hosted on jotform.com. Because the parent page cannot access form fields inside a cross-origin iframe, AttributionHub injects attribution data by appending URL search parameters to the iframe src. Jotform reads these parameters and pre-fills the corresponding fields.

If you use Jotform’s less common “source code” embed option (which renders standard <form> elements directly on the page), the standard forms handler populates it automatically.

Prerequisites

Before you begin, make sure:

• The AttributionHub tracking script is installed on your site (see Installation)
• You have a Jotform account with access to create or edit forms
• You have access to your website’s code or CMS to add the embed code

Step 1: Add Hidden Fields in Jotform

1. Open your form in the Jotform form builder
2. Click Add Form Element (or the + button)
3. Go to Widgets and search for Hidden Field, or go to Form Elements > Short Text and configure it as hidden
4. Add a hidden field for each attribution value you want to capture
5. For each hidden field:
   • Click on the field to open its properties
   • Set the Field Label to something descriptive (e.g., “Attribution Channel”)
   • In the Field Details or Properties panel, find the Field Name or Unique Name setting
   • Set it to match the AttributionHub field name (e.g., ah_lt_channel)
   • Make sure the field type is set to Hidden
6. Save the form

Enable URL Pre-population

Jotform supports pre-populating fields via URL parameters. To enable this:

1. In the form builder, click on the gear icon (Form Settings)
2. Go to Form Settings > Show More Options
3. Find Allow pre-population via URL parameters (or similar wording) and enable it
4. This allows Jotform to read URL parameters and fill corresponding fields

Step 2: Embed the Form on Your Page

Use Jotform’s standard iframe embed code. No modifications are needed — AttributionHub detects Jotform iframes automatically.

Iframe embed (default):

<iframe
  id="JotFormIFrame-XXXXXXXXXXXX"
  title="Your Form Title"
  src="https://form.jotform.com/XXXXXXXXXXXX"
  frameborder="0"
  style="min-width:100%;max-width:100%;height:600px;border:none;"
  scrolling="no"
></iframe>

AttributionHub detects Jotform iframes by looking for:

• iframe[src*="jotform.com"]
• iframe[src*="jotform.co"]
• [data-attrhub-jotform]

Source code embed (alternative): If you use the “Full Source Code” embed option, Jotform renders a standard HTML form on the page. The standard forms handler covers this automatically — just make sure the hidden fields have name attributes matching your field mapping.

Step 3: Test the Integration

1. Visit a page on your site that contains the Jotform embed
2. Open your browser’s DevTools (F12)
3. Find the Jotform iframe in the Elements panel
4. Check that its src URL now includes attribution parameters, for example:

   https://form.jotform.com/XXXXXXXXXXXX?ah_lt_channel=Organic+Search&ah_lt_source=Google&ah_lt_medium=organic

5. Submit a test entry through the form
6. In Jotform, go to Submissions (or My Forms > click on your form > Submissions) and check that the hidden fields contain attribution values

For a full testing walkthrough, see Verify It Works.

How It Works

1. AttributionHub scans the page for Jotform iframes (matching jotform.com or jotform.co in the src)
2. For each iframe found, it reads attribution data from localStorage
3. It builds URL search parameters from your field mapping (each field name becomes a URL parameter key)
4. It updates the iframe src with the new URL, which causes the iframe to reload
5. Jotform reads the URL parameters and pre-fills the corresponding hidden fields in the form

This happens automatically on page load. When the visitor submits the form, the pre-filled hidden field values are included in the submission.

Recommended Hidden Fields

The table below lists the most commonly used fields. For the complete field catalog, see Field Reference.

Core Attribution Fields (Latest Touch)

Core Attribution Fields (First Touch)

Global Fields

For additional fields including latest-non-direct touch (ah_lnd_*), drill-down fields, raw UTM parameters, and ad click IDs, see the full Field Reference.

Custom Field Mapping

If your Jotform hidden fields use different names, override the defaults:

<script>
  window.attrhub = {
    settings: {
      fieldMapping: {
        "latest.attribution.channelGroup": "channel",
        "latest.attribution.source": "source",
        "latest.attribution.campaign": "campaign",
      },
    },
  };
</script>

See Configuration for the full mapping reference.

Tips

• Jotform integrations — Jotform supports 100+ integrations (Google Sheets, Salesforce, HubSpot, Slack, etc.). Hidden field values are included in all integration payloads, so attribution data flows through to your downstream tools automatically.
• Jotform reports — Use Jotform’s built-in report builder to create charts and tables based on attribution data, showing which channels generate the most submissions.
• Conditional logic — You can use the attribution hidden field values in Jotform’s conditional logic to show or hide form sections based on the visitor’s traffic source.
• Multiple forms on one page — AttributionHub detects and populates all Jotform iframes on the page independently.
• Payment forms — Attribution hidden fields work in Jotform payment forms just like regular forms. This lets you track which marketing channels drive the most revenue.
• Jotform Tables — When viewing submissions in Jotform Tables, hidden field values appear as columns. You can filter and sort by attribution values.

Troubleshooting

Hidden fields are empty in submissions

1. Verify that URL pre-population is enabled in Jotform’s form settings.
2. Check the iframe src in DevTools to confirm attribution parameters are being appended.
3. Make sure the hidden field names in Jotform exactly match the parameter names in the URL. Names are case-sensitive.
4. Enable logging (enableLogging: true in settings) and check the browser Console.

Iframe not detected

If your Jotform iframe uses a custom domain or regional domain that does not match jotform.com or jotform.co, add the data-attrhub-jotform attribute to the iframe:

<iframe
  data-attrhub-jotform
  src="https://form.jotform.eu/XXXXXXXXXXXX"
  ...
></iframe>

Form height issues after URL update

When AttributionHub updates the iframe src, the iframe reloads. If you use Jotform’s auto-height script, it should adjust the iframe height after reload. If the height does not update, check that Jotform’s handleIFrameMessage script is loaded on the page.