Chuck Grimmett

Let’s say you have two forms: One is a basic contact info form and the other is more in-depth. You have them separated because you want to capture contact information as soon as possible to follow up on leads, but you want some information to be carried over to the second form. You also want the user to be greeted with a message to finish the form when they come back to the site (if they leave).

Here is a sketch of what you’d need to do:

1. When the first form is filled out and submitted, set a cookie. You could either use vanilla Javascript or a plugin like js-cookie.
2. The cookies should contain the value of the form fields that were entered. Use something like form.fieldname.value in JavaScript or $("input").val() in jQuery to retrieve them.
3. Set the cookies for a reasonable amount of time. 2 weeks?
4. On the landing page, check for cookies. If they are there, change the call to action from “Apply Now” to “Finish your application!”
5. On the second form page, write a function to check to see if there is are cookies set. If there is, read the cookies and insert their values into the form.
6. When the form on the second page is submitted, use a function to remove the cookies. They are no longer necessary.

The implementation is left as an exercise for the reader. This outline should get you well on your way!