Varshi99
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script language="JavaScript">
var cost;
function fun() {
cost = 0;
if (document.myform.Item1.checked) { cost = cost + 20.15; }
if (document.myform.Item2.checked) { cost = cost + 10.10; }
if (document.myform.Item3.checked) { cost = cost + 26; }
if (document.myform.Item4.checked) { cost = cost + 29; }
document.myform.total.value = "$" + cost.toFixed(2); // Show cost with 2 decimal places
}
</script>
<form name="myform" action="http://localhost/cgi-bin/purchaseInfo.cgi" enctype="text/plain" method="post">
<center><h2>Online Shopping Application</h2></center>
<strong>Personal Details:</strong>
<table>
<tr><td>Name:</td><td><input type="text" name="customer"/></td></tr>
<tr><td>City:</td><td><input type="text" name="city"/></td></tr>
<tr><td>Phone:</td><td><input type="text" name="phone"/></td></tr>
<tr><td>Email_Id:</td><td><input type="text" name="email"/></td></tr>
</table>
<hr/>
<strong>Description:</strong>
<p>Following are some items with their prices.</p>
<p>Choose the required items by checking the checkboxes.</p>
<hr/>
<strong>Items to be chosen:</strong>
<br/>
<p><input type="checkbox" name="Item1" value="Item1_chosen" onclick="fun()"> Item One($20.15)</p>
<p><input type="checkbox" name="Item2" value="Item2_chosen" onclick="fun()"> Item Two($10.10)</p>
<p><input type="checkbox" name="Item3" value="Item3_chosen" onclick="fun()"> Item Three($26)</p>
<p><input type="checkbox" name="Item4" value="Item4_chosen" onclick="fun()"> Item Four($29)</p>
<input type="text" name="total" value="0" readonly />
<br/><br/>
<center>
<input type="submit" value="Place the Order" />
<input type="reset" value="Clear" />
</center>
</form>