Question

Problem with hidden fields in embed typeform

  • 29 March 2022
  • 7 replies
  • 539 views
L

Hi!

I have some issues with hidden fields in embed typeform. I did everything as it was written in the article (https://www.typeform.com/help/a/dynamically-pass-hidden-fields-from-a-url-to-an-embedded-typeform-for-advanced-users-4404652303892/) but cant get hidden field value properly. As I run the typeform directly from the link (https://z3kpdg9qv6h.typeform.com/to/SE5IuPna#id=xxxxx) the hidden value (id) is collected properly, but when I use it on the website (https://www.expert-transport.pl/a#id=xxxxx) I can’t get it. Can anyone check the website source and tell me what am I doing wrong?

Thanks in advance!

7 replies

Liz
Rank
Userlevel 7
Badge +5

Hi @LukaszPytlak Welcome to the community! How are you passing the hidden field information into the embed URL? Is it redirected from somewhere in your site/CRM?

Life is a series of awkward moments separated by snacks.
L

The whole body section of the website is just typeform so it looks like this:

<body>

<div data-tf-widget="SE5IuPna" data-tf-transitive-search-params="id" data-tf-hidden="id=xxxxx" data-tf-iframe-props="title=Ankieta B2C (Work in Progress)" data-tf-medium="snippet" style="width:100%;height:100vh;"></div><script src="//embed.typeform.com/next/embed.js"></script>
</body>

 

I think that everything is done properly as told here: https://www.typeform.com/help/a/dynamically-pass-hidden-fields-from-a-url-to-an-embedded-typeform-for-advanced-users-4404652303892/ 

so I am a little bit confused.

 

What I need to get is to collect the id from the website address, for example if someone will get a link https://www.expert-transport.pl/a#id=zaqws I need to collect the typeform with the “zaqws” id. It works when I make it directly from typeform (https://z3kpdg9qv6h.typeform.com/to/SE5IuPna#id=zaqws) but from the website I can’t get the id value.

Liz
Rank
Userlevel 7
Badge +5

Hi @LukaszPytlak Thanks! How are you passing the ID into the URL? 

@mathio do you see anything in the code that needs to be adjusted? 😀

Life is a series of awkward moments separated by snacks.
mathio
Rank
Userlevel 7
Badge +5

Hello @LukaszPytlak 

you correctly specified data-tf-transitive-search-params option in your embed. However you also have data-tf-hidden="id=xxxxx" option which is overriding the first one.

I think all you need to do is remove the data-tf-hidden option from your embed code.

L

Did what you told me to do (remove the “data-tf-hidden”) but still can’t get the id value. Does anyone have any idea? @mathio @Liz 

E

Looks like it is part of the fragment (after the # ).

My tests show typeform won’t read that. If you stick it into the ?params= part, it reads that.

 

 

mathio
Rank
Userlevel 7
Badge +5

Hidden fields are correctly passed in the URL fragment (after #). Previously we used query params (after ?) and typeforms still support passing hidden fields that way as a fallback for compatibility reasons.

 

I built an example here: https://glitch.com/edit/#!/cliff-bristle-trillium

Typeform embedded in the example above has 1 hidden field named id.

 

In left column the value is hardcoded: data-tf-hidden="id=foobar" 

Value is passed in URL fragment.

 

In right column the value is dynamically read from the URL: data-tf-transitive-search-params="id"

Value is passed in query string, because data-tf-transitive-search-params can be used for other use cases too (eg. you can pass tracking params like this and tracking pixels usually require query string, not fragment).

Reply


Still need help?

Don't be shy and ask the community.

Ask your question here!
Community T&Cs