Hidden field not being passed to form results | Community
Skip to main content
Answered

Hidden field not being passed to form results

  • February 22, 2024
  • 2 replies
  • 115 views
M

Issue - looking to pass the gclid value. I’m popping up typeform from a button

https://mycorsicacharter.com/

Scenario 3 is an issue

  1. If gclid in url = accepted
  2. If gclid is present in data-tf-hidden on pageload = accepted (so data-tf-hidden work)
  3. If data-tf-hidden filled after pageload - i’m looking to fill the value from a cookie on pageload -gclid not recorded. This is important if the user does not convert on the landing page

<div data-tf-popup="Oag6s5yd" data-mo="v4" data-tf-opacity="100" data-tf-size="100" data-tf-iframe-props="title=DMA 1" data-tf-transitive-search-params="gclid,wbraid,fbclid,msclkid" data-tf-medium="snippet" data-tf-hidden="gclid=55" style="color:white !important;cursor:pointer" ;="" data-tf-loaded="true"><a>Get Started</a></div>

 

How do i change data-tf-hidden on pageload, before user click so that the gclid value sticks?

Best answer by mathio-tf

Hello @Mo_the_Pirate 

you will need to use embed SDK directly via its JavaScript API with some custom code:

<div id="my-button" style=""><a>Get Started</a></div>
<link rel="stylesheet" href="//embed.typeform.com/next/css/popup.css" />
<script src="//embed.typeform.com/next/embed.js"></script>
<script>
document.querySelector('#my-button').onclick = () => {

  // retrieve gclid value
  const [, cookieGclid] = document.cookie.match(/gclid=([^;]+)/) || []
  const urlGclid = new URLSearchParams(window.location.search).get('gclid')

  // prioritize value from URL, then cookie or use default if neither
  const gclid = urlGclid ?? cookieGclid ?? 55

  window.tf.createPopup('Oag6s5yd', {
    size: 100,
    iframeProps: { title: 'DMA 1' },
    transitiveSearchParams: ['wbraid', 'fbclid', 'msclkid'],
    hidden: { gclid }
  }).open()
}
</script>

 

View original

2 replies

Liz
Community Team
Forum|alt.badge.img+5
  • Liz
  • Tech Community Advocate
  • 15014 replies
  • February 22, 2024

@mathio might be able to help with this!

Life is a series of awkward moments separated by snacks.
mathio-tf
Typeform
Forum|alt.badge.img+5
  • mathio-tf
  • Typeform
  • 888 replies
  • Answer
  • February 23, 2024

Hello @Mo_the_Pirate 

you will need to use embed SDK directly via its JavaScript API with some custom code:

<div id="my-button" style=""><a>Get Started</a></div>
<link rel="stylesheet" href="//embed.typeform.com/next/css/popup.css" />
<script src="//embed.typeform.com/next/embed.js"></script>
<script>
document.querySelector('#my-button').onclick = () => {

  // retrieve gclid value
  const [, cookieGclid] = document.cookie.match(/gclid=([^;]+)/) || []
  const urlGclid = new URLSearchParams(window.location.search).get('gclid')

  // prioritize value from URL, then cookie or use default if neither
  const gclid = urlGclid ?? cookieGclid ?? 55

  window.tf.createPopup('Oag6s5yd', {
    size: 100,
    iframeProps: { title: 'DMA 1' },
    transitiveSearchParams: ['wbraid', 'fbclid', 'msclkid'],
    hidden: { gclid }
  }).open()
}
</script>

 

Liz
john.desborough
Grace
3 people like this
  • Liz
    Liz
  • john.desborough
    john.desborough
  • Grace
    Grace

Reply


Still need help?

Don't be shy and ask the community.

Ask your question here!
Community T&Cs