Make a copy of the order form from lab exercise 4 and name it l6p3.php. Remove t
ID: 3688761 • Letter: M
Question
Make a copy of the order form from lab exercise 4 and name it l6p3.php. Remove the JavaScript code to calculate the total price. Add JavaScript code to produce an error message and suppress submission of the form if any quantity field contains non-numeric data. (It's OK for a quantity to be empty, but if it's non-empty, it must have only numbers.) Add an action= attribute to your tag to submit the form to http://weblab.kennesaw.edu/formtest.php. Test that the form is submitted correctly when the quantities are numeric or empty, and that an error message is produced otherwise. (Regular expressions are your friend. Anything that's not a digit is bad. What is the predefined class for non-digits?)
LAB EXERCISE 4 ORDER FORM
<script>
function calculateTotal ()
{
var carrot = parseInt(document.getElementById("CarrotSeedspackets").value);
var corn = parseInt(document.getElementById("CornSeedspackets").value);
var beet = parseInt(document.getElementById("BeetSeedspackets").value);
var carrotTotal = carrot * 5;
var cornTotal = corn * 2;
var beetTotal = beet * 7;
var realTotal = carrotTotal + cornTotal + beetTotal*1.07;
document.getElementById("test").value=realTotal;
}
</script>
<form action="/formtest.php">
Number of packets of Carrot seeds:<br>
<input type="text" value="0" id="CarrotSeedspackets"><br>
Number of packets of Corn seeds:<br>
<input type="text" value="0" id="CornSeedspackets"><br>
Number of packets of Beet seeds:<br>
<input type="text" value="0" id="BeetSeedspackets"><br>
Customer name:<br>
<input type="text" name="Fullname" ><br>
Shipping Address:<br>
<input type="text" name="Address" ><br><br>
<input type="radio" name="card" value="Visa" checked> Visa<br>
<input type="radio" name="card" value="MasterCard"> MasterCard<br>
<input type="radio" name="card" value="Discover"> Discover<br>
</form>
<input type="button" value="Submit" />
<input type="text" id="test">
Explanation / Answer
<script>
function calculateTotal ()
{
var carrot = parseInt(document.getElementById
("CarrotSeedspackets").value);
var corn = parseInt(document.getElementById
("CornSeedspackets").value);
var beet = parseInt(document.getElementById
("BeetSeedspackets").value);
if(isNaN(carrot))
alert("enter a numeric value in carrot");
else
if(isNaN(corn))
alert("enter a numeric value in corn");
else
if(isNaN(beet))
alert("enter a numeric value in beet");
else
{
document.forms['cal'].submit();
}
}
</script>
<form name=cal id=cal
action="http://weblab.kennesaw.edu/formtest.php">
Number of packets of Carrot seeds:<br>
<input type="text" value="0" id="CarrotSeedspackets"><br>
Number of packets of Corn seeds:<br>
<input type="text" value="0" id="CornSeedspackets"><br>
Number of packets of Beet seeds:<br>
<input type="text" value="0" id="BeetSeedspackets"><br>
Customer name:<br>
<input type="text" name="Fullname" ><br>
Shipping Address:<br>
<input type="text" name="Address" ><br><br>
<input type="radio" name="card" value="Visa" checked>
Visa<br>
<input type="radio" name="card" value="MasterCard">
MasterCard<br>
<input type="radio" name="card" value="Discover">
Discover<br>
</form>
<input type="button" value="Submit"
/>
<input type="text" id="test">
Related Questions
drjack9650@gmail.com
Navigate
Integrity-first tutoring: explanations and feedback only — we do not complete graded work. Learn more.