How do I retrieve the current response after user fills in the form?

Hello @cherrygot 

you can recall information (use respondent answers) in your redirect links and build a link with query params based on their answers.

For a better integration you could use our embed SDK and retrieve the response on form submit and then process it. You can find details in this article I wrote:
https://medium.com/typeforms-engineering-blog/integrate-typeform-with-next-js-b27a5306bfbb

Response API can retrieve specific responses by supplying included_response_ids parameter (if you supply just one ID, it will return only one specific response).

Hi @mathio ,

I looked at your example and it looks like you are retrieving the response answers using the response_id and form id. However, is not entirely clear to me how you were able to retrieve the `response_id`, in the code it seems to be passed to the function specified in onSubmit(), is that correct?

1const handleTypeformSubmit = async ({ responseId }) => {  const response = await fetch(`/api/response?formId=${formId}&responseId=${responseId}`)  if (response.ok) {    const { name, rating } = await response.json()    console.log(‘Form responses’, { name, rating })    // TODO: save name and rating in cookie     //       and use it to personalize the tooltip }}id={formId}    chat    tooltip={getTooltip()}    key={`${typeformName}-${typeformRating}`}    onSubmit={handleTypeformSubmit}    hidden={{      visitor_name: typeformName,      visitor_rating: typeformRating === null ? ‘’ : (isTypeformRatingGood ? ‘good’ : ‘bad’),

@Jver you are correct, the responseId is passed to onSubmit callback. It identifies the response that was just submitted.

Thanks, I think I got it. Very helpful article when you read the github embed docs first

I am running into one problem, when I have two typeforms to embed it stops working, as they both require the same parameters which run into a conflict:

1const { open, close, toggle, refresh } = window.tf.createPopup('id')

renaming the parameters like so breaks the functionality:

1const { open_2, close_2, toggle_2, refresh_2 } = window.tf.createPopup('id')document.querySelector('.my_class').onclick = toggle_2

Is there a fix for this issue?

In JavasScript you simplify it and do it like this:

1const popup1 = window.tf.createPopup('id1')document.querySelector('.my_class_1').onclick = popup1.toggle()const popup2 = window.tf.createPopup('id2')document.querySelector('.my_class_2').onclick = popup2.toggle()

It is not necessary to decompose the assignment into multiple variables. However if you really want to:

1const { toggle } = window.tf.createPopup('id1')document.querySelector('.my_class_1').onclick = toggle()const{ toggle: secondToggle } = window.tf.createPopup('id2')document.querySelector('.my_class_2').onclick = secondToggle()

I have everything set up correctly, but I have one more question. I want to track utm parameters and have set them up similarly to the hidden variables, like in the code below. However, I am not receiving utm parameters in the submissions of the forms. Is there another way I should go about passing the utm parameters?

1const create_and_start_popup = (    nref,    oref,    source,    medium,    campaign,    content,    term) => {    const create_popup = window.tf.createPopup('<form_id>', {        hidden: {            'oref': oref,            'nref': nref        },        tracking: {            'source': source,            'medium': medium,            'campaign': campaign,            'content': content,            'term': term        },        onSubmit: async (data) => {            url = 'https://www.huurprijshulp.nl/bedankt/?form=nl&response_id=' + data.responseId            window.location.replace(url)        }    })    // start popup    create_popup.toggle()}

Did you setup hidden fields in your typeform with utm_ prefix? If yes, then you need to name them accordingly in the tracking object (eg. not source but utm_source)..