Get a professional website for $99 per month. One week turnaround.

JavaScript Trick to Save Form Data

Home Elementor JavaScript Trick to Save Form Data

May 10, 2023

In this video I will show you how to keep form values when navigating between pages.

To follow this tutorial you will need Elementor Pro:

How to Pass Form Data to Another Page Video:


  • 0:00 Introduction
  • 0:59 Tutorial Begins
  • 3:43 Chrome – View Session Storage

JavaScript Session Storage Code:

  // Retrieve form data from sessionStorage if it exists
  if (sessionStorage.getItem('formData')) {
    const formData = JSON.parse(sessionStorage.getItem('formData'));
    document.getElementById('form-field-firstname').value = formData.firstname;
    document.getElementById('form-field-lastname').value = formData.lastname;

  // Save form data to sessionStorage when user navigates away from the page
  window.addEventListener('beforeunload', () => {
    const formData = {
      firstname: document.getElementById('form-field-firstname').value,
      lastname: document.getElementById('form-field-lastname').value,
    sessionStorage.setItem('formData', JSON.stringify(formData));


JavaScript Go Back Code:

					<button onclick="goBack()">Go Back</button>

function goBack() {


*Some of the links on this page are affiliate links, meaning we may receive a commission if you follow them. This allows us to continue providing free content and educational resources for you. Thank you for supporting our small business!

More Free Resources