javascriptembedurl-parametersgeturltypeform

Grab URL parameter passed and add to iframe URL

I'm using typform embed code but they didn't provide any sample code to grab a custom parameter from the URL and insert it into the embed code they generate. They explain it can be done though. The steps are outlined below. I'm looking for some code that will grab any parameters passed on the URL and add them to the typeform URL within the iframe. Hopefully, the timing works out and by the time the iframe code executes, it will have the parameter passed.

  1. User clicks on link https://mysite/embedpage.html?sfid=2324234
  2. Page code should read the sfid passed to the URL and add this parameter plus the value passed to the typeform URL within the embed code as seen below:
<html> 
  <head> 
  </head> 
  <body> 
    <iframe id="typeform-full" width="100%" height="100%" frameborder="0" 
      src="https://mysite.typeform.com/to/tpEHHt?sfid=2324234">
    </iframe> 
    <script 
      type="text/javascript" src="https://embed.typeform.com/embed.js">
    </script> 
  </body> 
</html>
Solution

  • Did you try something like this ?

    function getQueryVariable(variable) {
    var query = window.location.search.substring(1);
    var vars = query.split('&');
    for (var i = 0; i < vars.length; i++) {
        var pair = vars[i].split('=');
        if (decodeURIComponent(pair[0]) == variable) {
            return decodeURIComponent(pair[1]);
        }
    }
    console.log('Query variable %s not found', variable);
}

document.getElementById('typeform-full').src = `https://mysite.typeform.com/to/tpEHHt?sfid=${getQueryVariable('sfid')}`;