Email-URL pass-through

Design help Custom code
3

Here is the custom code for passing form data through a URL. For your setup you would need to make an email field on the second page (and third) and then hide it. This way when the user submits on the second page you will have the email along with the submitted data.

Page 1:

$(document).ajaxStop(function() {

  // Get all form values
  var string = '?' + $( ".FORMCLASS" ).find('input, select, textarea').map(function() {
  	// encodes characters such as ?,=,/,&,:
    var header = encodeURIComponent((this.name || this.id).trim());
    return header ? header + '=' + encodeURIComponent($(this).val()) : null;
  }).get().join('&');

  // Redirect to this URL with the value of the form fields appended to the end of the URL
  location.href = 'https://YOURDOMAIN/PAGE-2-URL' + string;
});

Page 2:

function getParam(name) { name = name.replace(/[\[]/, "\\[").replace(/[\]]/, "\\]"); var regex = new RegExp("[\\?&]" + name + "=([^&#]*)"), results = regex.exec(location.search); return results === null ? "" : decodeURIComponent(results[1].replace(/\+/g, " ")); }
Webflow.push(function() {

  // Auto-populate form fields
  $('input:text, input[type=email]').each(function() {
    var paramValue = getParam(this.id);
    if(this.value == "" && paramValue != "") this.value = paramValue;
  });

});

You are going to have to modify this code a bit if you want to add another step but hopefully this gets you started. Feel free to ask any questions.

Edit: Forgot to mention both of those code snippets are to be included in the “before body tag” custom code section in the settings of their respective page.

2 Likes