JSFiddle - React, Tailwind, and code Playground
HTML
<body>
<h1>Car Rental</h1>
<form name="frmRental" method="post">
Name:<br>
<input type="text" name="txtName" size="20" maxlength="25"><br>
Address:<br>
<input type="text" name="txtAddress" size="20" maxlength="25"><br>
City:<br>
<input type="text" name="txtCity" size="20" maxlength="25"><br>
State:<br>
<input type="text" name="txtState" size="2" maxlength="2"><br>
Zip:<br>
<input type="text" name="txtZip" size="5" maxlength="5"><br>
E-Mail Address:<br>
<input type="email" name="txtEmail" size="20" maxlength="25"><br>
Car Type:<br>
<input type="text" name="txtCarType" size="20">
<br>
Pickup Date:
<br>
<input type="date" name="txtPickupDate" size="10">
<br>
Return Date:
<br>
<input type="date" name="txtReturnDate" size="10">
<br><br>
<input type="button" name="btnSave" value="Save Reservation" onClick="setCookies()">
<input type="reset" value="Reset Form">
<input type="button" name="btnRedisplay" value="Redisplay Reservation" onClick="displayCookies()">
</form>
</body>
</html>
JavaScript
function setCookies()
{
// this function will set cookies for each field in the reservation form, and set them to expire after one day
var Name = document.forms[0].txtName.value;
var Address = document.forms[0].txtAddress.value;
var City = document.forms[0].txtCity.value;
var State = document.forms[0].txtState.value;
var Zip = document.forms[0].txtZip.value;
var Email = document.forms[0].txtEmail.value;
var CarType = document.forms[0].txtCarType.value;
var PickupDate = document.forms[0].txtPickupDate.value;
var ReturnDate = document.forms[0].txtReturnDate.value;
var myDate = newDate();
myDate.setDate(myDate.getDate() + 7);
document.cookie = "name=" + encodeURIComponent(Name) + "; expires=" + myDate.toUTCString();
document.cookie = "address=" + encodeURIComponent(Address) + "; expires=" + myDate.toUTCString();
document.cookie = "city=" + encodeURIComponent(City) + "; expires=" + myDate.toUTCString();
document.cookie = "state=" + encodeURIComponent(State) + "; expires=" + myDate.toUTCString();
document.cookie = "zip=" + encodeURIComponent(Zip) + "; expires=" + myDate.toUTCString();
document.cookie = "email=" + encodeURIComponent(Email) + "; expires=" + myDate.toUTCString();
document.cookie = "carType=" + encodeURIComponent(CarType) + "; expires=" + myDate.toUTCString();
document.cookie = "pickupDate=" + encodeURIComponent(PickupDate) + "; expires=" + myDate.toUTCString();
document.cookie = "returnDate=" + encodeURIComponent(ReturnDate) + "; expires=" + myDate.toUTCString();
window.alert ("Your reservation has been saved.");
} // end function setCookies()
function displayCookies()
{
// this function will read the saved cookies, and repopulate the form with the cookie values
var cookieString = decodeURIComponent(document.cookie);
var cookieArray = cookieString.split("; ");
if (document.cookie == 0)
{
alert("You have not made a...