Add Variables from Form as Parameters for Thank You Page

[Stephanie_Berr2]

I have a form that I'm looking to send to a calendar scheduling tool after the form is submitted. I want to pass the information they submitted in the form through the URL but cannot figure out how to get these variables into the query string for the thank you page url.

Thank you page URL: www.example.com/meeting

Desired thank you page + query string: www.example/meeting?name=first%20last&email=john@email.com

[SanfordWhiteman · Accepted solution]

MktoForms2.whenReady(function(form){
  form.onSuccess(function(submittedValues,serverThankYouURL){    
    var appendValues = {
           name : submittedValues.FirstName + " " + submittedValues.LastName,
           email : submittedValues.Email
    };
     
    /* -- NO NEED TO TOUCH BELOW THIS LINE -- */
    
    var thankYouLoc = document.createElement("a");

    thankYouLoc.href = serverThankYouURL;
    thankYouLoc.search += Object.keys(appendValues).reduce(function(acc,key){
        acc += "&" + encodeURIComponent(key) + "=" + encodeURIComponent(appendValues[key]);
        return acc;
      }, "");

    document.location = thankYouLoc;
    return false;
  });
});

No need to tag me though, if it's a new post I'll see it.

[KirstenOS]

@SanfordWhiteman, is there a method for carrying these appended values over in the URL if the user clicks onto another page? That does not generate null values if the values are empty?

[Jo_Pitts1]

@KirstenOS ,

do they have to stay in the URL?  More commonly, you'd take them from the URL and put them into cookies.

Then when a form is loaded, it can take values from the cookies that have been persisted.

You can go down the full/partial attribution path @SanfordWhiteman is talking about or there are plenty of examples online of how to cookie things like UTM codes, GCLID, FBCLID etc (e.g. https://jennamolby.com/how-to-use-cookies-to-capture-url-parameters/), and from there it is easy to have Marketo Forms pick those values up, simply by telling it to read from a cookie for a field value.

Cheers

Jo

[SanfordWhiteman]

---

here are plenty of examples online of how to cookie things like UTM codes, GCLID, FBCLID etc (e.g. https://jennamolby.com/how-to-use-cookies-to-capture-url-parameters/),

---

That code is absolutely awful + broken though. Hope you’re not using it. 🙂

[Jo_Pitts1]

Nope.. it was just the first example I could find 🙂

[Darshil_Shah1]

FYR: This post on the nation also describes the concept of storing the UTMs in to a cookie and referencing it to add UTM values to the form's hidden UTM fields when the user fills out the form w/o UTMs.

[Jo_Pitts1]

Nice spot @Darshil_Shah1.

I don't think the part to populate the fields into the form is needed any more right, as Marketo can do that natively now.

[Darshil_Shah1]

You mean adding autofill on the hidden fields using the cookie value, right?

[Jo_Pitts1]

Correct

[Darshil_Shah1]

Would there be any race condition between the hidden form fields getting populated from the cookie by the form auto-fill and cookie being set/updated by the script? Wouldn't possibly wanna risk the possibility of hidden form values getting populated with the existing cookie values before the cookie can get updated with the new values from the UTMs. The script has a defined order of operations - first create/update the cookies from the UTMs if present, and then plug them in the hidden form fields.

[SanfordWhiteman]

---

Would there be any race condition between the hidden form fields getting populated from the cookie by the form auto-fill and cookie being set/updated by the script? Wouldn't possibly wanna risk the possibility of hidden form values getting populated with the existing cookie values before the cookie can get updated with the new values from the UTMs. The script has a defined order of operations - first create/update the cookies from the UTMs if present, and then plug them in the hidden form fields.

---

There’s no race condition if the code that manages the cookies runs before loadForm().

[Darshil_Shah1]

yeah - spot on!

[SanfordWhiteman]

It doesn’t seem to have gone through any testing at all. The RegExp is bonkers.

[SanfordWhiteman]

is there a method for carrying these appended values over in the URL if the user clicks onto another page? That does not generate null values if the values are empty?

---

For that you’d need a fuller-featured attribution tracking JS library. There are several out there; I’ll be publishing a fresh one to the Products blog in the next couple of months (microTracker).

[Stephanie_Berr2]

Thank you @SanfordWhiteman .

Now if I want to throw in a variable from a hidden field in the form between the thank you page url and before the appended values?

www.example/meeting/hiddenfield?name=first%20last&email=john@email.com

[SanfordWhiteman]

@Stephanie_Berr2 could you return to the thread and mark my answer as the solution? Thanks.

[SanfordWhiteman]

You can add any fields you want to the appendValues object, using the same syntax I did for Email.

The order of unique fields in a query string is extremely unlikely to matter. Yechnically the parameters are ordered (as the query string is split into an ordered list) but it would be extremely fragile if your server actually cared about the order.

[Stephanie_Berr2]

@SanfordWhiteman I feel like you're the one who can help me answer this.