Add reset button to the form, Onclick of reset it will clear the form and alert the user. Hands-on Project 1-4 Lecture Sample Work 2 Shipping Address Choose an address Home 1 Main St. Sicilia, MA 02103 Work 15 Columbine Ln. Crab City, MA 02104 Street Address City State Zip
Add reset button to the form, Onclick of reset it will clear the form and alert the user.
<!DOCTYPE html>
<html>
<head>
<!--
Get Elements Sample
-->
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<title>Hands-on Project 1-4</title>
<link rel="stylesheet" href="styles.css" />
<script src="modernizr.custom.05819.js"></script>
</head>
<body>
<header>
<h1>
Lecture Sample Work 2
</h1>
</header>
<article>
<h2>Shipping Address</h2>
<form>
<fieldset id="addroptions">
<legend><span>Choose an address</span></legend>
<label for="homeoption" id="homeaddr">
<span>Home</span><br/>
1 Main St.<br />
Sicilia, MA 02103
<input type="radio" id="homeoption" name="shippingaddr"
onclick="document.getElementById('streetinput').value = '1 Main St.';
document.getElementById('cityinput').value = 'Sicilia';
document.getElementById('stateinput').value = 'MA';
document.getElementById('zipinput').value = '02103';" />
</label>
<label for="workoption" id="workaddr">
<span>Work</span><br/>
15 Columbine Ln.<br />
Crab City, MA 02104
<input type="radio" id="workoption" name="shippingaddr"
onclick="document.getElementById('streetinput').value = '15 Columbine Ln.';
document.getElementById('cityinput').value = 'Crab City';
document.getElementById('stateinput').value = 'MA';
document.getElementById('zipinput').value = '02104';" />
</label>
</fieldset>
<fieldset id="contactinfo">
<label for="streetinput">
Street Address
<input type="text" id="streetinput" />
</label>
<label for="cityinput">
City
<input type="text" id="cityinput" />
</label>
<label for="stateinput">
State
<input type="text" id="stateinput" />
</label>
<label for="zipinput">
Zip
<input type="text" id="zipinput" />
</label>
</fieldset>
</form>
</article>
</body>
</html>
Trending now
This is a popular solution!
Step by step
Solved in 2 steps with 2 images
