How do you dynamically populate typeform quiz with source and medium via hidden field?

Hi @Duzer Group Thanks for stopping by the community! Where do you have the data stored? And how are you planning to pass in the data to the hidden field? Any further information you could provide would be helpful. 

As stated in the post it is stored in a first party cookie.

As far as how to pass it into a hidden field that is my question i am looking for help on

Hi @Duzer Group Can you share any more about the cookie or how the data is stored there? A URL where the form is located would help as well. Thanks!

Hey @Duzer Group! 👋🏼

Make sure to share with us more info about the cookie and how you store your data over there. A link to your form would also be helpful. 

Wishing you a great day!

Hi @Duzer Group 

You will probably need to build some custom code to achieve this

In JavaScript you can access all the cookies on a page using document.cookie

This should give you a string that would look like this cookie_key1=cookie_value1; cookie_key2=cookie_value2; ...

As you can see each key is separated by ; 

So you will need a function to extract values and set values in cookie.

// Cookie manipulation
// From https://www.w3schools.com/js/js_cookies.asp

function setCookie(cname, cvalue, exdays) {
  var d = new Date();
  d.setTime(d.getTime() + exdays * 24 * 60 * 60 * 1000);
  var expires = "expires=" + d.toUTCString();
  document.cookie = cname + "=" + cvalue + ";" + expires + ";path=/";
}

function getCookie(cname) {
  var name = cname + "=";
  var decodedCookie = decodeURIComponent(document.cookie);
  var ca = decodedCookie.split(";");
  for (var i = 0; i < ca.length; i++) {
    var c = ca[i];
    while (c.charAt(0) == " ") {
      c = c.substring(1);
    }
    if (c.indexOf(name) == 0) {
      return c.substring(name.length, c.length);
    }
  }
  return "";
}

Finally, you would use the Embed SDK to pass values to the embed.

Add this to your HTML page

<div class="wrapper"></div>
<script src="//embed.typeform.com/next/embed.js"></script>
<link rel="stylesheet" href="//embed.typeform.com/next/css/widget.css" />

And display the form

function showEmbed() {
  window.tf.createWidget(FORM_ID, {
    container: embedElement,
    width: 600,
    height: 550,
    hidden: { email: emailFromCookie, name: nameFromCookie},
    onSubmit: function () {
      setCookie(`displayed_typeform${FORM_ID}`, true, 365);
    },
  });
}

Here is a full example: https://glitch.com/~tf-embed-cookie-hidden