Use items from local storage to pre-populate a webform
02:23 20 Nov 2025

I am new to HTML, CSS and Javascript.

I am building a website that has a shopping cart feature and I am able to list my products, and and remove to the shopping cart and have the UI update the shopping cart badge on the menu bar.

Upon checkout, I don't want to take payment using an e-commerce platform, instead I want to transition the page to a webform, for the customer to populate their name, address, phone number, email etc.. all the usual things, but I want a non-editable field displayed that shows the contents of their shopping cart.

When they click submit, I need this web form to email a pre-determined email address i.e. pre-sales@mysite.com with all these fields including the items from the shopping cart.

The part I'm struggling with, is how to retrieve the items from localStorage and put them in a web form field that is not editable but visible and part of the webform.

Any suggestions would help.

javascript html css webforms local-storage